lightbox

Lightbox es un conjunto de scripts y css que al implementarlos en tu pagina hace que una foto se agrande cuando le hagas click.

• Para ello lo primero que debes hacer es descargar  los paquetes en : lightbox
• Después, usando el filezilla, deberás subir todas las carpetas que están dentro del paquete comprimido que te has descargado.
• Para poder activar el efecto lightbox en la pagina deberas escribir este código en l apartado head:

//Estos dos códigos activan los scripts y después de "src =" deberás escribir la dirección de la carpeta donde se encuentra la carpeta js.

<script src="js/jquery-1.7.2.min.js"></script> 

<script src="js/lightbox.js"></script>

//Este otro código funciona de la misma manera y sirve para activar los css.

<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

• Por último deberas ir al codigo de la imagen y añadir los siguinte:

<a href="images/image-1.jpg" rel="lightbox[roadtrip]">imagen1</a>

ejemplo:

La imagen esta escrita así: 

<img style="width: 1600px; height: 1200px;" alt=""
src="file:/C:/Ikasleak/INF1/survival/Imagenes/Sample%20Pictures/Juan/geopardo.jpg">

con efecto lightbox sería así:

<a href="images/image-1.jpg" rel="lightbox[roadtrip]"><img style="width: 1600px; height: 1200px;" alt=""src="file:/C:/Ikasleak/INF1/survival/Imagenes/Sample%20Pictures/Juan/geopardo.jpg"></a>

Hemos sustituido el código de la imagen donde antes ponía imagen1. Así lograremos que al hacer clic en la imagen se efectúe el efecto lightbox y se abra la imagen que hallamos seleccionado con la dirección en azul.