Frames - Dirigir los enlaces

  • Por
Explicación sobre cómo dirigir el enlace al frame que deseemos que actualice, que no tiene porque ser el mismo donde está situado.
La única particularidad destacable en el ejemplo del capítulo anterior, y en el manejo de frames en general, se trata de que cada uno de los enlaces que colocamos en las páginas actualizan el frame donde está colocado este enlace. Por ejemplo, si tenemos enlaces en la parte inferior de la ventana, en el espacio correspondiente al tercer marco, actualizarán los contenidos del tercer frame, que es donde están situados los enlaces.

Este efecto que comentamos se puede observar en el ejemplo de la página de la carnicería, tal como quedaría al incluir los códigos de las distintas páginas.

Lo lógico es que al pulsar sobre un enlace de la barra de navegación actualicemos el frame principal, que es donde habíamos planeado colocar los contenidos, en lugar del frame donde colocamos la barra de navegación, que debería mantenerse fija. Para conseguir este efecto debemos hacer un par de cosas:

  1. Darle un nombre al frame que deseamos actualizar
    Dicho nombre se indica en la etiqueta <FRAME> de la definición de frames. Para ello utilizamos el atributo name, igualado al nombre que le queremos dar a dicho marco.
  2. Dirigir los enlaces hacia ese frame
    Para ello debemos colocar en el atributo target de los enlaces -etiqueta <A>- el nombre del frame que deseamos actualizar al pulsar el enlace.
Después de darle un nombre al frame principal, nuestra declaración de frames quedaría de la siguiente manera.

<frameset rows="15%,*,75">
    <frame src="pagina1.html">
    <frame src="pagina2.html" name="principal">
    <frame src="pagina3.html">
</frameset>

Además, deberíamos colocar el atributo target a los enlaces, tal como sigue.

<a href="pagina2.html" target="principal">Portada</a> |
<a href="productos.html" target="principal">Productos</a> |
<a href="contacto.html" target="principal">Contacto</a>

Una vez realizados este par de cambios podemos ver como los enlaces de la barra de navegación sí actualizan la página que deben.

Valores para el atributo target

Como hemos visto, con el atributo target de la etiqueta <A> podemos indicar el nombre del frame que deseamos que actualice ese enlace. Sin embargo, no es este el único valor que podemos aplicarle al atributo. Tenemos algunos valores adicionales que podemos asignar a cualquier enlace en general.

_blank
Para hacer que ese enlace se abra en una ventana a parte. Nuestros ejemplos en este manual se suelen abrir en una ventana a parte, colocando este valor en el target de los enlaces que llevan a los ejemplos.

_self
Se actualiza el frame donde está situado el enlace. Es el valor por defecto.

_parent
El enlace se actualiza sobre su padre o sobre la ventana que estamos trabajando, si es que no hay un padre.

_top
La página se carga a pantalla completa, es decir, eliminando todos los frames que pudiera haber. Este atributo es muy importante porque si colocamos en nuestra página con frames un enlace a una página externa, se abriría en uno de los frames y se mantendrían visibles otros frames de la página, haciendo un efecto que suele ser poco agradable, porque parece que están evitando que nos escapemos.

La sintaxis de uno de estos valores de atributos colocados en un enlace sería la siguiente.

<A href="http://www.guiarte.com" target="_top">Acceder a guiarte.com</A>

Autor

Miguel Angel Alvarez

Miguel es fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Comenzó en el mundo del desarrollo web en el año 1997, transformando su hobby en su trabajo.

Compartir

Comentarios

eduar

29/9/2007
todo esta my claro solo que cuando pongo la pagina
http://www.hotmail.com en un frame esta toma toda
la pagina, solo me pasa con esta pagina.

Esteban

09/8/2010
buenooo
De mucha ayuda amigo, ayudas a mucha gente al hacer esto.
Graciass..!

Carlos

17/9/2010
Gracias por sacarme de dudas y apuros.
Tu ayuda me saco de muchos problemas con el redireccionamiento de los frames, estoy muy agradecido muchas gracias.

Marco

24/5/2011
dudas en los frames
necesito que me salga un marco que sea en la parte superior que sea un titulo e la parte de en medio sean 3 contenidos divididos y en la parte inferior sea otro contenido me podrías ayudar a o auxiliar para poder realizarla por favor... o pon un ejemplo de como hacerla por favor me urge

Bryan Reinoso

19/11/2013
Genial
Muchisimas gracias, busque en varias webs y nada , has sido el unico que me ha quitado la duda. Muchas gracias. Sigue con ello, lo haces genial<br />
Genio!

Esteban87

18/2/2014
como ir a otra pagina desde un frame?
hice una pagina, donde uso frame para una sección para poner artículos, que queden 6 por paginas y cambiar solo el la pagina del frame y no toda la pagina al ir a los otros artículos, lo que no se hacer es que el link de esos artículos se abran en una pagina completa y no en el frame, como lo hago?

peter

03/4/2014
en respuesta a Esteban87
Solo tienes que poner en target="new" y con eso te lo abre en una pagina nueva

saludos

jhonatan

14/4/2014
sobre frames
hola tengo cargada 4 frames en una pagina index. uno de ellos es menu y otro contenido los demas son cabecera y pie de pagina. en la pagina de menus tengo enlazadas a otras paginas como empresa, quienes somos, etc. quisiera que cuando haga click en las opciones de menu la pagina a la que tengo enlazadas solo me aparecieran en el frame de contenido y no en otra pestaña ..... ayudame.....me puedes responder porfa....

cendy

19/11/2014
iframe
consulta!
cómo hago para direccionar de una imagen del index hacia un contenido en iframe? dado que este contenido está en el segundo nivel de mi pagina. osea ejemplo:
1. registros_academios(primer nivel) en este html se muestra el menú completo y es aquí donde parte todo y se redirecciona a un iframe que llamo "centro"
2. ciclo_verano_ora (segundo nivel) este es uno de los botones del menu, aquí me va a mostrar la información de este boton y que va estar dentro del iframe "centro". Es aquí donde tengo problema ya que no me muestra.
haber si me pueden ayudar

Eyra

03/12/2014
Por fin
Perfectamente explicado, muchas gracias. Llevo horas buscando las diferencias entre los 4 atributos de target (self, top..) y esta es la página donde mejor lo explican. Sigo con dudas, no entiendo bien como funciona _parent, pero me puedo hacer una idea y ya con la práctica me imagino que me quedará más claro. Gracias!

mario

17/6/2016
popup
todo me funcionó de maravilla de hecho estube buscando en muchas paginas y no encontre una respuesta tan clara y cencilla como esta. tengo un pequeño problema al usar el inframe en un link yo pongo target="principal" para llamar el inframe y perfecto funciona bien pero que pasa si quiero habrir un popup y ocultarle el url al popup tambien. no puedo poner los dos atributos target="principal" y target="_blank" simultaneamente. como hago necesito que sea un popup pero que no se vea la url.

Jose

28/6/2016
frame
Muchas Gracias !!!

Mis mejores deseos...

Ricardo

29/8/2016
Opinion
Esta pagina es muy buena, el articulo sobre frame tambien, pero pienso que el atributo "target" debio haber sido explicado en el articulo de "links" en html y no en este. Saludos.

Alejandro

30/9/2016
LLamar una pagina informacion de contenido distinto mostrando todos los frames
Hola!!
Excelente articulo!

Le explico brevemente mi caso, tengo una pagina (index.html) con 5 frames: encabezado,borde derecho, borde izaquierdo, pie de pagina y contenido.
Para contenido tengo, home, quienes somos, novedades, contactos, servicios.
Si ingreso con el url de index, funciona todo perfecto. El detalle es que desde el navegador llamo a cualquier contenido y me muestra nada mas contenido. Mi pregunta si existe alguna forma que desde el navegador llamen por ejemplo a contactos, me muestre todos los frames y la informacion de contacto.
Agradecido por el apoyo que puedan aportar.

Saludos,
Alejandro


Todo estaba perfecto hasta



estoy desde hace rato buscando la forma de llamar un

Juan

11/4/2017
Como hago la siguiente pagina
Necesito saber como hago esta pagina de mi colegio en html pero q ala ver me muestre toda la informacion en la misma pagina sin enlaces