Muy al principio de lightbox.js tienes estas variables que tienes que cambiar o no para que apunten a donde tienes las imágenes:
Código:
var fileLoadingImage = "/images/loading.gif";
var fileBottomNavCloseImage = "/images/close.gif";
Las imágenes de prev.gif y next.gif si están referenciadas en el archivo CSS (lightbox.css).
También tienes que llamar al .css y a los .js desde el head de la página:
Código:
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
Ya solo resta poner un atributo en el enlace de la imagen, rel:
Código HTML:
<a href="imagenes/imagen.png" rel="lightbox"><img src="imagenes/imagen.thumb.png" /></a>
Para que las imágenes pertenezcan a un grupo (para poder usar anterior y siguiente), tienes que poner en rel algo así:
Código HTML:
<a href="imagenes/imagen1.png" rel="lightbox[galeria1]"><img src="imagenes/imagen1.thumb.png" /></a>
<a href="imagenes/imagen2.png" rel="lightbox[galeria1]"><img src="imagenes/imagen2.thumb.png" /></a>
<a href="imagenes/imagen3.png" rel="lightbox[galeria1]"><img src="imagenes/imagen3.thumb.png" /></a>
Espero haberte ayudado.
¡Un saludo!
PD: Estaría bien evitar los privados para brindar ayuda, que aunque la intención sea buena, la ayuda siempre le puede venir bien a otra persona.
