Galleria es un plugin de jQuery para simplificar la creación de galerías de imágenes para sitios webs y dispositivos móviles.
Este framework es compatible con dispositivos touch como iPad y Android. El plugin es gratuito para su versión clasica, pero cuenta con varios temas mejorados que tienen un costo.
Implementación de Galleria
Primero descargaremos el Zip que contiene el plugin de Galleria y el tema clásico.
Descargar: Galleria-1.2.7.zip
Incluir los headers
[html]
<!– load jQuery –>
<script src="jquery.js"></script>
<!– load Galleria –>
<script src="galleria-1.2.7.min.js"></script>
[/html]
Incluiremos el Framework jQuery y Galleria 1.2.7
[css]
#galleria{height:320px}
[/css]
el id #galleria define el alto de nuestro contenedor de la galería de imágenes
Estructura del HTML
El siguiente bloque de código debe contener un div con id=”galleria” para definir la lista
de galerías dentro de ella.
[html]
<div id="galleria">
<a href="imagen.jpg">
<img data-title="Titulo"
data-description="Descripción"
src="imagen.jpg"/>
</a>
<a href="imagen2.jpg">
<img data-title="Titulo 2"
data-description="Descripción 2"
src="imagen2.jpg"/>
</a>
</div>[/html]
Iniciar la galería en el Footer
El siguiente código
deberá ir justo antes de cerrar el tag para inicializar la galería, en la primera línea asignamos la ruta del tema que utilizaremos, en la segunda ejecutamos la creación de la galería.
[javascript]
Galleria.loadTheme('galleria.classic.min.js');
Galleria.run('#galleria');
[/javascript]
Web Oficial: Galleria.io
Descargar: Galleria-1.2.7.zip
Ver Demo: Galleria Theme Preview