Animated Responsive Image Grid es un plugin jQuery para crear una galería de imágenes responsive con distinto efectos y segundos de transición a la hora de presentarse en nuestro sitio web.
Puedes configurarlo de distintas maneras para adaptarlo a tu sitio web como:
- El número de filas y columnas.
- Tipo de animación
- Retardo entre transiciones
- Definir tamaño para los distintas resoluciones de los dispositivos con los que se accede al sitio
Una opción bastante interesante de este plugin es que puedes configurarlo para se muestre una galería de imágenes en el fondo de una pàgina web que además seguirá teniendo el mismo efecto de transición.
Por defecto tienes 3 formas distintas de presentarlos:
- Con un ancho fijo (Ver Demo)
- Cubriendo el ancho de toda la pantalla (Ver Demo)
- Modo pantalla completa (Ver Demo)
¿Cómo usar Animated Responsive Image Grid?
Como suele pasar con este tipo de plugins jquery, la implementación es bastante sencilla.
La parte HTML sería algo de este estilo:
[html]
[/html]
Y la llamada a la función tan sólo habría que hacerla de la siguiente manera:
[javascript]
$(function() {
$( ‘#ri-grid’ ).gridrotator();
});
[/javascript]
Es importante no olvidarse de incluir las siguientes librerías que usa este plugin:
- jQuery Transit: Para la mayoría de transiciones.
- Modernizr: Para comprobar el soporte a los distintos navegadores.
Seguro que le vais a dar utilidad a este plugin porque verdaderamente es bastante atractiva para los que desarrollamos sitios web.