Your SlideShare is downloading. ×
Qué son los frames (1)
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Qué son los frames (1)

761
views

Published on

Frames ytipos de frames en html

Frames ytipos de frames en html

Published in: Education

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
761
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
12
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. QUÉ SON LOS FRAMESUn frame es una especie de marco o recuadro independiente en el que podemos cargar una página web.Podemos así dividir una página web en diferentes partes o ventanas, cada una con sus propios bordes ybarras de desplazamiento, pudiendo cargar dentro de cada una de ellas una página externa independiente.Los frames permiten una flexibilidad de presentación extraordinaria, y para contenidos muy complejos,de difícil estructura por los medios convencionales del HTML, son casi insustituibles. De nuevo sepresenta la duda de para qué visualizador es preferible programar nuestro WWW.Los frames son parametrizables en cuanto a tamaño y número de áreas, si éstas se pueden redimensionarpor el usuario o son fijas, si tienen o no barras de scrolling, se pueden anidar, relacionar sus contenidosUN FRAME BÁSICO.En general, todas las páginas que contengan definiciones de frames:<HTML><HEAD><TITLE>Mititulo></TITLE></HEAD><FRAMESET><NOFRAMES><BODY> Su visualizador no soporta frames. Pulse<A HREF="indice.htm">aqui</A> para volver.</BODY></NOFRAMES><FRAME SRC="pagina1.htm" ><FRAME SRC="pagina2.htm" ></FRAMESET></HTML>No aparece el elemento <BODY> en su posición habitual, sino dentro de un elemento especial que seactiva sólo cuando el visualizador no soporta los frames: NOFRAMES. Si no declaras el áreaNOFRAMES y el visualizador no soporta este efecto, no se verá nada. Obviamente, los visualizadoresque sí soportan frames ignorarán el contenido del área NOFRAMES.Es posible definir cualquier combinación de áreas verticales y horizontales. La clave está en combinaradecuadamente los anidamientos del elemento <FRAMESET> con sus atributos COLS o ROWS segúninterese. Como puedes ver, el más importante es el primer <FRAMESET>, ya que es el que define cómova a ser "troceada" la página inicialmente, si en porciones verticales u horizontales, y sobre esta base sedeberán definir todos los demás anidamientos.Antes de nada, repasemos rápidamente las marcas HTML de gestión de marcos. N2.0 Documento <FRAMESET></FRAMESET> (en lugar Marco de<BODY>) N2.0 altura en filas <FRAMESET (píxel ó %) ROWS=,,,></FRAMESET> N2.0 altura en filas <FRAMESET (* = tamaño ROWS=*></FRAMESET> relativo) N2.0 anchura en <FRAMESET (píxel ó %) columnas COLS=,,,></FRAMESET> N2.0 anchura en <FRAMESET (* = tamaño
  • 2. columnas COLS=*></FRAMESET> relativo)N3.0b anchura del <FRAMESET BORDER=?> bordeN3.0b borde <FRAMESET FRAMEBORDER="yes|no">N3.0b color del borde <FRAMESET BORDERCOLOR="#$$$$$$">N2.0 Definición del <FRAME> (contenido de marco cada uno de los recuadros)N2.0 documento que <FRAME SRC="URL"> se debe mostrarN2.0 denominazione <FRAME del frame NAME="***"|_blank|_self| _parent|_top>N2.0 anchura de los <FRAME MARGINWIDTH=?> (margen márgenes izquierdo y derecho)N2.0 altura de los <FRAME MARGINHEIGHT=?> (margen márgenes superior e inferior)N2.0 barra de <FRAME desplazamiento SCROLLING="YES|NO|AUTO"> o noN2.0 no <FRAME NORESIZE> redimensionableN3.0b borde <FRAME FRAMEBORDER="yes|no">N3.0b color del borde <FRAME BORDERCOLOR="#$$$$$$">N2.0 contenido en <NOFRAMES></NOFRAMES> (para ausencia de navegadores marco antiguos)
  • 3. Para crear dos marcos verticales basta sustituir el término "rows" (filas) con el término "cols"(columnas):<FRAMESET cols="100,*"><frame name="sx" src="sx.htm"><frame name="central" src="central.htm"></FRAMESET>Es posible adoptar simultáneamente una división tanto en columnas como en filas, de manera quese cree una ventana dividida en varios marcos. Veamos cómo debemos intervenir en el códigoHTML del documento según el número y la posición de los marcos que queremos crear.<frameset rows="100,*"><frame name="alto" src="top.htm"><frameset cols="150,*"><frame name="sx" src="sx.htm.htm"><frame name="central" src="central.htm"></frameset></frameset>
  • 4. <frameset cols="120,*"><frame name="sx" src="sx.htm"><frameset rows="20%,60%,20%,*"><frame name="alto" src="top.htm"><frame name="central" src="central.htm"><frame name="bajo" src="basso.htm"></frameset></frameset><frameset cols="75%,25%"><frameset rows="20%,80%*"><frame name="alto" src="top.htm"><frame name="central" src="central.htm"></frameset><frame name="dx" src="dx.htm"></frameset>
  • 5. FRAMEBORDER se utiliza como atributo de FRAMESET y establece si serán visibles los bordes delframe o no. Puede tener dos valores: YES (por defecto) y NO.Si escribes:<FRAMESET FRAMEBORDER=NO COLS=30%,30%,30%><FRAME SRC="a.htm"><FRAME SRC="b.htm"><FRAME SRC="c.htm"></FRAMESET>Se obtiene un frame de tres columnas sin barras de separación entre ellas.BORDER* BORDER= " n " , con n = nº entero = nº de píxeles. En el caso de que se haya establecidoFRAMEBORDER=" 1 " o no se haya especificado, este atributo nos permite definir el grosor del bordeROWSROWS=" x,y,z,..." , para definir el nº de filas o marcos horizontales que va a tener la ventana, y dondelas variables x,y,z... van a definir el tamaño de cada marco horizontal, pudiendo definirse en píxeles o enporcentaje. También podemos fijar el tamaño de una fila o filas y en este caso el tamaño de esta será todoaquel que quede después de definir mediante píxeles o porcentajes las demás filas. Las combinacionesposibles son muchas, siendo su estructura análoga a las vistas para COLS.Si definimos tamaños en píxeles, estos serán absolutos, En este caso si todas las frames se indican de estemodo, los valores se ajustarán para que las frames ocupen la totalidad del espacio de la ventana delnavegador, no guardando siempre la proporción con la que se definen las frames.BORDERCOLOR se utiliza como atributo de FRAME y establece el color de los bordes visibles.Evidentemente, para que funcione, se tendrá que haber establecido FRAMEBORDER=yesSi escribes:<FRAMESET COLS=30%,30%,30%><FRAME BORDERCOLOR="red" SRC="a.htm"><FRAME BORDERCOLOR="blue"SRC="b.htm"><FRAME SRC="c.htm"></FRAMESET>Se obtiene un frame de tres columnas con la primera barra de separación roja y la segunda azul.Salir de una pantalla con framesPara salir de una pantalla compuesta de frames es necesario definir algun link. En efecto, si estamos enuna pantalla con, por ejemplo, dos frames, cualquier link invocado desde cualquiera de ellos, hace que lapágina llamada aparezca en ese mismo frame. Para volver a una pantalla "normal" sin frames, se puedeescribir un link con la sintaxis siguiente:<A HREF="indice.htm" TARGET="_parent">Ver índice sin marcos </A>
  • 6. El destino "_parent" indica que presente la página llamada por el link en el navegador que se estaejecutando, sin marcos y sin abrir nuevas ocurrencias del navegador.Existen otros valores predeterminados para el atributo TARGET: _blank que abre una nueva ventanadel navegador, _self que llama el destino del enlace a la misma ventana en que se está (valor pordefecto), y _top que funciona igual que _parent.EnlacesLos enlaces dentro de los marcos (es decir, cómo cargar una página en un marco diverso de aquél en quese encuentra el enlace) hay que hacer referencia al nombre que hemos asignado a los diferentes marcos enla fase de realización. Este nombre no se refiere al archivo sino a lo que aparece escrito después de"name=". Por ejemplo, en este caso:<framename="alto" src="top.htm">El nombre asignado es "alto".Tomemos la siguiente página subdividida en marcos:<frameset cols="20%,60%,20%"><frame name="sx" src="sx.htm"><frame name="central" src="central.htm"></frameset>Pongamos que de un enlace presente en "SX" tengamos que cargar otra página en el marco "central".Si el enlace presente en el marco "SX", fuera simplemente:<A HREF="nuova.htm">Hazclic</A>La página se cargaría dentro del mismo marco (es decir, "SX") porque sin adecuadas marcas específicasel navegador interpreta que debe cargar la nueva página en el mismo marco en que está presente el enlace.El código exacto sería:<A HREF="nuova.htm" TARGET="central">Haz clic</A>
  • 7. Otro uso fundamental de la marca <TARGET> es el de llamar un enlace a otra página, la cual sevisualizará ocupando la pantalla completa y eliminando todos los marcos preexistentes.Aquí está el código:<A HREF="nuova.htm" TARGET="_parent">Haz clic</A>Es posible también que queramos cargar, con un solo clic, dos o más marcos (naturalmente, la ventanatiene que estar dividida por lo menos en tres marcos).Tomemos una página subdividida como en la figura:<frameset cols="120,*"><frame name="sx" src="sx.htm"><frameset rows="100,*"><frame name="alto2" src="top.htm"><frame name="centrale3" src="central.htm"></frameset></frameset>
  • 8. Lo que queremos es insertar un solo enlace en el marco de "SX" que cargue simultáneamente dos páginasdiversas en los dos marcos de la derecha: "alto" y "central". Para ello, es necesario insertar algunas líneascon código JavaScript. La primera parte del código va insertada entre <HEAD></HEAD>:<HEAD><script language="JavaScript"><!-- Hidingfunctionloadtwo(page2, page3) {parent.alto2.location.href=page2;parent.centrale3.location.href=page3;}// --></script></HEAD>Mientras que la segunda parte deberá quedar comprendida entre <BODY></BODY>, donde se quiereinsertar el enlace:<BODY><FORM NAME="buttons"><INPUT TYPE="button" VALUE="Hazclic"onClick="loadtwo(nuovo1.htm,nuovo2.htm)"></FORM></BODY>
  • 9. Atributos: NAME Como ya habrás supuesto, es el nombre del frame incrustado. Puede omitirse si no es necesario. SRC Nombre de la página que se mostrará en el frame. WIDTH Número de pixels que tendrá el frame de ancho. También puede indicarse en tanto por ciento respecto al ancho total de la ventana, como se hace en los frames convencionales. HEIGHT Número de pixels que tendrá el frame de alto. También puede indicarse en tanto por ciento respecto al alto total de la ventana. FRAMEBORDER Indica si se debe mostrar el borde del frame. 1 = si (por defecto) 0 = no. MARGINWIDTH Indica el número de pixels que tendrá el ancho de los márgenes interiores izquierdo y derecho del frame respecto a su contenido. MARGINHEIGHT Indica el número de pixels que tendrá el ancho de los márgenes interiores superior e inferior del frame respecto a su contenido. SCROLLING Indica si hay que mostrar barras de scroll dentro del frame incrustado. Sus valores pueden ser: Yes, No y Auto (por defecto).