Visualizador de imágenes (I)
por Luciano Moreno, del departamento de diseño web de BJS Software.

Introducción.-

Un amiguete me consultó el otro día cómo podría implementar en su página web un visualizador de imágenes basado en una ventana flotante. Inicialmente el tema parecía muy fácil, por lo que abrí mi editor de HTML y empecé a escribir código. Pero lo que parecía sencillo se transformó en un pequeño reto, ya que no era capaz de conseguirlo. ¿Porqué?.

Muchas veces empezamos a escribir código sin pasar antes por la etapa más importante: PENSAR. En el caso que nos ocupa tenemos dos ventanas, la principal y la flotante, y el tema es cómo pasamos valores desde una a otra.

JavaScript nos permite abrir ventanas flotantes con facilidad, pero sólo habilita unas referencias cómodas entre ventanas cuando llamamos a la ventana principal desde la flotante. En el caso contrario, llamara variables y métodos de la ventana flotante desde la principal, la cosa se complica sobremanera.

Mediante el método open del objeto window podemos abrir una ventana, darle un nombre y acceder a su contenido, pero éstos procedimientos sólo funcionan bien cuando las llamadas se hacen desde la misma función que abre la ventana.

Si abrimos una ventana flotante y posteriormente queremos acceder a sus propiedades desde otra función de la página principal distinta de la que la ha abierto, los problemas empiezan a aparecer, siendo el mayor de ellos el hecho de que el navegador no reconoce a la ventana flotante como objeto propio.

Ése fué mi fallo: querer acceder a las propiedades de la ventana flotante desde diferentes funciones distintas. Trás darle unas cuantas vueltas en la cabeza conseguí encontrar una solución al problema, con lo que pude implementar el visuallizador que estaba buscando.

Todo se basa en establecer las variables de control en la ventana principal, haciendo que la flotante léa el contenido las mismas al cargarse, y las adopte como valores para sus propias variables.

Vamos pués a construir nuestro visualizador, que debe reunir las siguientes características:

1. las imágenes deben aparecer en una ventana flotante, que debe ser siempre la misma.
2. el usuario debe poder elegir en cada momento qué imagen se va a mostrar en la ventana flotante.
3. la ventana flotante debe estar siempre visible; no puede recogerse a la barra de tareas.

Pasemos entonces a dar solución a estas exigencias.

Home - HTMLWebScript - Ventanas - Visualizador de imágenes - 1 - 2 - 3