Slaider de imagenes

MENU

14 MARCOS EN EL LENGUAJE HTML

MARCOS EN EL LENGUAJE HTML 
  
Los marcos son divisiones de la ventana del navegador, de manera que cada uno
de ellos puede mostrar una web diferente. Cada marco se comporta como una
página HTML independiente y tiene su propio código fuente. Por tanto
 existirá un documento HTML por cada marco y un documento HTML global
o contenedor que indicará como debe de realizar las divisiones.

 El archivo global o contenedor no tendrácuerpo, en el lugar de la etiqueta
<body> irá la etiqueta <frameset> y su cierre </frameset>. 
Dicha etiqueta debe contener los atributos cols y/o rows  para dividir la
página en columnas o filas. Pudiendo recibir valores tanto en porcentaje como
en píxeles.

 Por ejemplo si queremos dividir la pantalla en 2 columnas que ocupen el 
25% y 75% respectivamente lo realizaremos del siguiente modo:
<html>
<frameset cols="25%,75%">
<frame "/>
<frame "/>
</frameset>
</html>

 También se puede expresar en píxeles, por ejemplo si queremos dividir
la pantalla del navegador en 3 filas de 200,400 y 300 píxeles respectivamente:
<html>
<frameset rows="200px,400px,300px">
<frame "/>
<frame "/>
<frame "/>
</frameset>
</html>

 Lo habitual es dejar que el último marco ocupe el resto de la pantalla, para lo cual usaremos el asterisco (*).
<html>
<frameset rows="200px,400px,*">
<frame "/>
<frame "/>
<frame "/>
</frameset>
</html>
Incluso podemos especificar proporciones de lo que queda de pantalla, por
ejemplo si queremos crear una web dividida en tres columnas cuyo primer 
marco ocupe 100 píxeles , el segundo ocupe un tercio del resto de pantalla
y el tercer marco 2 tercios del resto de pantalla se utilizaría el siguiente
código:
<html>
<frameset cols="100px,*,2,*">
<frame "/>
<frame "/>
<frame "/>
</frameset>
</html>

 Definiendo un marco (frame): 

 Dentro de la etiqueta del conjunto de marcos <frameset> se encerrarán las
definiciones de cada uno de los marcos mediante la etiqueta sin cierre<frame/>.

 Para indicar el archivo HTML que se mostrará en dicho marco debemos emplear
su atributo src asignándole como valor la URL de dicho archivo.
En este atributo podremos escribir bien la ruta de un archivo de nuestro
servidor, bien la dirección de otra web o bien la URL de una imagen que 
queramos mostrar en dicho marco.

 <html>
<frameset cols="25%,25%,*">
<frame src="productos.html"/>
<frame src="http://www.google.es"/>
<frame src="paisaje.jpg"/>
</frameset>
</html>
Por defecto se suelen mostrar bordes para cada uno de los marcos, para
controlar si tendrá borde o no usaremos el atributo frameborder con los 
valores "yes" o "no".El ancho delborde puede controlarse con su atributo
border así como el color por medio del atributo bordercolor.
<html>
<frameset cols="25%,75%">
<frame src="productos.html" border="2px" bordercolor="#ffa301"/>
<frame src="paisaje.jpg"/>
</frameset>
</html>
Para controlar los márgenes horizontales y verticales del marco emplearemos
marginwidth y marginheight respectivamente.
<html>
<frameset cols="50%,*">
<frame src="productos.html" marginwidth="70px" marginheight="90px"/>
<frame src="paisaje.jpg"/>
</frameset>
</html>

 El atributo scrolling se usa para especificar si se desea o no barra de
desplazamiento en el marco siendo 3 sus posibles valores:

 -"yes": Muestra siempre la barra de desplazamiento.
-"no": Nunca aparece
-"auto": Aparece sólo cuando es necesaria.

 Con el atributo noresize se puede impedir que el usuario cambie el tamaño
de un marco, este atributo no lleva asignado valor.

 Navegadores que no soportan marcos: 

 Aunque hoy en día raramente encontramos un navegador que no soporte marcos,
HTML definió la etiqueta <noframes> y su cierre </noframes>  para encerrar el código HTML a mostrar en ese caso.
<html>
<frameset rows="25%,*">
<frame src="menu.html"/>
<frame src="principal.html"/>
<noframes>
<body>
Lo sentimos, pero su navegador no soporta marcos.
</body>
</noframes>
</frameset>
</html>
Anidamiento de marcos: 

Al igual que vimos con las tablas, un marco puede contener a su vez a otro
conjunto de marcos, para ello bastará introducir otro <frameset> 
dentro del documento HTML mostrado dentro de alguno de los dos marcos.

 Supongamos que queremos hacer una web que tenga la siguiente división 
de marcos:

 Marco1 Marco2
Marco3

 La primera división que haremos será la de las 2 columnas, para ello crearemos un archivo llamado "principal.html" con el siguiente código:

 <html>
<frameset cols="50%,*">
<frame src="izquierda.html"/>
<frame src="derecha.html"/>
</frameset>
</html>
El Marco1 contendrá una web llamada "izquierda.html" y el otro marco otra web llamada "derecha.html" con el siguiente contenido:
<html>
<frameset rows="50%,*">
<frame src="arriba.html"/>
<frame src="abajo.html"/>
</frameset>
</html>
A su vez hemos dividido el archivo de la columna derecha en 2 marcos (Marco2 y Marco3) que contendrán a su vez los  documentos "arriba.html" y "abajo.html" respectivamente.

Enlaces y marcos:

Podemos abrir una página en un marco determinado para ello debemos antes
darle un nombre en el archivo contenedor mediante el atributo <name> </name> de la etiqueta <frame>:
<html>
<frameset cols="20%,*">
<frame src="enlaces.html" name="marco_izq"/>
<frame src="principal.html" name="marco_der"/>
</frameset>
</html>
Dentro del archivo "enlaces.html" crearíamos los enlaces especificando
mediante el atributo target="" el nombre del marco donde queremos abrir
el link: 
<html>
<a href="http://www.google.es" target="marco_der">Ir a google
<a href="http://www.yahoo.com" target="marco_der">Ir a yahoo
</html>