Es uno de los más elegantes exhibidor de imágenes.
Cada imagen se puede vincular desde una miniatura (que habrá que haber editado previamente) o desde una palabra o frase.
En una misma página web puede haber más de una colección de imágenes independientes entre sí, simplemente editando el nombre de la colección en el
código HTML que hay escribir para hacer funcionar el exhibidor.
Hay que descargar y alojar en nuestro servidor el archivo de estilo: lytebox.css, el archivo lytebox.js
y la carpeta images con las imágenes del reproductor.
Los dos archivos y la carpeta dentro del mismo directorio:
Luego, en la cabecera del documento hay que hacer una llamada a los archivos lytebox.js y
lytebox.css.
De esta forma:
Después, en el punto en el que se quiera mostrar el vínculo desde las miniaturas:
<a href="ruta_de_la_imagen1.jpg" title="Título de la imagen 1" rel="lyteshow[coleccion1]">
<img src="ruta_de_la_imagen1_mini.jpg" alt="Título de la imagen 1" height="83" width="110">
<a href="ruta_de_la_imagen2.jpg" title="Título de la imagen 2" rel="lyteshow[coleccion1]">
<img src="ruta_de_la_imagen2_mini.jpg" alt="Título de la imagen 2" height="83" width="110">
<a href="ruta_de_la_imagen3.jpg" title="Título de la imagen 3" rel="lyteshow[coleccion1]">
<img src="ruta_de_la_imagen3_mini.jpg" alt="Título de la imagen 3" height="83" width="110">
Organizando cada imagen en una celda de una tabla (así está en el ejemplo) si se desea...
Y cambiando, lógicamente, las dimensiones del ancho y alto de la miniatura.