Responsive Lightbox
Lightbox
Muchos sitios web utilizan galerías de imágenes para mostrar sus productos y servicios. Este tipo de galerías muestran una serie de miniaturas de imágenes que se amplían al pinchar sobre cada imagen. Hasta hace poco, la técnica más utilizada para construir una galería consistía en incluir las miniaturas en la página y abrir cada imagen grande en una ventana emergente (o pop-up) o en una nueva página.
Método
Los pasos necesarios para incluir librerías "Lightbox" en una página web son básicamente cuatro:
- Enlazar los archivos CSS que utiliza la librería
- Enlazar los archivos javaScript requeridos
- Definir las funciones, si son necesarias
- Colocar el código HTML para la galería como se indica en la documentación específica de la librería
El uso de técnicas basadas en JavaScript ha supuesto una revolución en la creación de las galerías de imágenes y ha permitido mejorar la experiencia de navegación del usuario. La técnica se conoce como Lightbox y fue creada originalmente por Lokesh Dhakar. Lightbox es una técnica muy sencilla de utilizar, funciona correctamente en todos los navegadores y mantiene la semántica del documento. La mayoría de los plugin se basan en jQuery.
jQuery es una librería JavaScript rápida, pequeña y rica en funciones. Hace que un documento HTML pueda manipularse profundamente de forma sencilla, permite manejar eventos, animaciones y Ajax de forma mucho más simple. Funciona en la mayoría de los navegadores. Con esta combinación de versatilidad y capacidad, jQuery ha cambiado la forma en que millones de personas escriben JavaScript.
El desarrollo de sitios Web sensibles al dispositivo electrónico con el que se visualiza (Responsive Design) se está apoderando de la industria del Diseño Web. Que las "cajas de luz" o lightbox sean adaptativas es casi una necesidad cuando desarrollamos sitios Web actuales.
