Mouseover sobre botón con efecto fade y jQuery
Escrito por Martín Iglesias y leído 11,595 veces. Ver comentarios
Este tutorial me lo ha pedido Diana desde Facebook y básicamente se trata de animar un botón con efecto fade al pasar el ratón por encima utilizando, desde ya, jQuery para la animación.
Lo que necesitamos para empezar es una imagen tal como se ve en la foto aquí arriba, donde estarán todos los botones en fila con el estado normal y en la fila de abajo, todos los botones con el efecto final. El efecto a realizar será el que ves arriba de todo en mi web, en los iconos de las redes sociales.
Para ello, tengo hecha una imagen con todos los iconos a la vez (así ahorramos código y peso de carga en la web) de 265px de ancho por 96px de alto. Es decir, que si son 5 iconos, cada icono tendrá 53px de ancho por 48px de alto (por cierto, estos iconos se consiguen en iconspedia.com, menos el de G+ que lo hice yo).


