Demostración Descargar
Image Hover es un conjunto de efectos para imágenes que se ejecutan al pasar el mouse por encima. A diferencia de la versión anterior que se encontraba disponible en la antigua versión de zkreations, estas no requieren estar siempre en una lista, y ademas el html es mínimo, basta solo con encerrar la imagen en algún contenedor y agregar la class ihover.
Instalación
Descargar el archivo adjunto en esta entrada e incluir image-hover.min.css arriba de </head> de la siguiente forma:
<link rel="stylesheet" href="image-hover.min.css"/>
Si no puedes alojar el archivo css incluye directamente el contenido de image-hover.min.css con el resto del css de tu web.
Instalar en Blogger
Abre el archivo image-hover.min.css y copia todo el contenido. Ahora ve a edición html, busca ]]></b:skin> y arriba de eso pega el código copiado con anterioridad.
Uso básico
Crear un contenedor y agregar la class ihover + el efecto que necesites, puedes elegir entre fade, up, bottom, left, right, circle, circle2, circle3. Ejemplo:
<a class="ihover fade" href="#pageUrl"><img src="img/img-01.jpg"/></a>
Limitaciones
No puedes agregar un grupo de imágenes dentro de un contenedor, cada imagen requiere un contenedor independiente.
