Navegador desplegable con frames

Este es un reportaje que se tiene que leer a continuación del reportaje Cómo hacer un navegador desplegable, publicado en desarrolloweb.com. En ese reportaje enseñábamos a crear un navegador desplegable con un elemento SELECT de un formulario.

Muchos visitantes han utilizado ya el script con éxito, pero algunos han escrito con una duda para su utilización en una página realizada con frames. La duda consiste en el navegador solo nos actualiza el frame en el que está, y lo interesante para ellos sería que actualizase un frame distinto. Es un problema muy lógico dado que a menudo se coloca el navegador de modo que esté siempre visible, en un frame donde tenemos los controles de navegación y el área que deseamos que se actualice es la correspondiente al frame principal.

Cambios en el script

El único sitio donde vamos a tener que hacer cambios es en el script que contiene la función a la que llamamos destino(). Hay que adaptar esa función para que podamos cambiar la página de un frame distinto al que estamos.

En nuestro anterior ejemplo hacíamos window.location = url para cambiar el contenido del frame donde estaba el navegador. Ahora debemos cambiar el window.location de un frame distinto a este y para acceder a location de un frame distinto se consigue a través de esta encadenación de objetos:

window.parent.frames[].window.location

frames[] es un vector de frames donde el primer frame del FRAMESET sería frames[0], el segundo sería frames[1] y así sucesivamente. Por si no ha quedado claro, veamos con un ejemplo.

Tenemos este FRAMESET

<frameset rows="*,40">
<frame name="principal" src="index.html" marginwidth="10" marginheight="10" scrolling="auto" frameborder="no">
<frame name="menudesplegable" src="despleg.html" marginwidth="10" marginheight="10" scrolling="auto" frameborder="no">
</frameset>

En el segundo frame tenemos el la página que contiene menú desplegable. Como es el segundo frame accederíamos a su location de esta manera:

window.parent.frames[1].window.location = url

El script entero quedaría así:

<script language=javascript>
function destino(){
     url = document.navegador.secciones.options[document.navegador.secciones.selectedIndex].value
     if (url != "no") window.parent.frames[0].window.location = url;
}
</script>

Eso es todo, ya no hace falta cambiar más cosas para cumplir nuestros objetivos.

Si quieres, puedes descargarte un ejemplo de esta ayuda funcionando. desplegableconframes.zip 2Kb