Efecto “Hover” usando CSS

He llamado efecto “Hover” al efecto que sucede tras pasar el puntero del mouse sobre un objeto, en este caso, sobre una imagen que cambia a texto cuando me poso sobre ella (ver imágenes). Personalmente, prefiero implementar una web con el efecto “hover” usando CSS; antes, lo hacía con flash, pero no todos tenían instalado el flash player y claro, puede ser muy simple instalarlo pero hay muchas personas –mayores sobre todo- que no entendían que sucedía. Además, en ocasiones –dependiendo del navegador- tenías que hacer doble clic sobre él para activarlo.

Por ello, quise compartir con ustedes este buen tutorial, uno de de los mejores para mi, donde puedes implementar el efecto “hover” usando CSS. Al final del post pueden encontrar un enlace hacia una demo del efecto y un par de enlaces más, hacia el tutorial.

Ejemplo 1: Cambio de imágenes tras posar el puntero del mouse

Ejemplo 2: Cambio de imágenes al retirar el puntero del mouse

(Efecto “hover”: lo he llamdo así al efecto que se avisora al posar el puntero del mouse sobre un objeto).

Enlace | Visitar tutorial (original)
Enlace | Tutorial (traducido español) (Cuidado! que las sentencias CSS tambíen se han traducido)
Ver | Demo (Efecto)

[post_ad]