Iconos de Suscripción “Social Drop” que giran al pasar el cursor

Los iconos sociales son de las cosas que mas buscan los blogueros porque es bien sabido que un pack de iconos llamativos atraerán la atención del lector y con ello se aumentara la posibilidad de que dicho lector se suscriba a nuestras redes sociales, es por ello que hoy les voy a compartir un pack de iconos sociales en forma de gotas que he llamado “Social Drop” y que al pasar el cursos sobre ellos giran completamente.

Vista Previa del truco.

Para crear este espectacular widget he usado CSS, mas específicamente la sintaxis transform: rotate .

Para agregar este truco en tu blog debes ir a Diseño, Añadir gadget, HTML/JavaScript y pegar el siguiente código:

<center><div id="socialicons"><a href="URL DE TU FACEBOOK" target="_blank"><img  src="http://1.bp.blogspot.com/-TUge_shy7YQ/Ux4gSVggQRI/AAAAAAAADx8/VmBzi5giTjE/s1600/Facebook-64.png" /></a><a href="URL DE TU GOOGLE PLUS" target="_blank"><img  src="http://2.bp.blogspot.com/-mrt6ABMaLz0/Ux4gSfN61FI/AAAAAAAADx4/IRf0xvK55dw/s1600/Google-64.png"  /></a><a href="URL DE TU TWITTER" target="_blank"><img  src="http://4.bp.blogspot.com/-fMJU6W1Vjho/Ux4gvKZIJCI/AAAAAAAADyQ/sTw5xGPTI70/s1600/Twitter-64.png"  /></a><a href="URL DE TU PINTEREST" target="_blank"><img  src="http://4.bp.blogspot.com/-EyFooKyyklk/Ux4gs7i8CYI/AAAAAAAADyI/nEKTnv0x8Wo/s1600/Pinterest-64.png" /></a>
</div></center>
<style>
#socialicons img{
 -moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;}
#socialicons img:hover{
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);}
</style>

Ahora debes reemplazar lo que esta resaltado en color azul por lo que se indica en cada caso y por ultimo guardar los cambios.

Espero que te haya gustado estos espectaculares iconos de suscripción y que sigas visitando Mil Trucos Blogger (encontraras cientos de recursos para tu blog).

0
Shares

3 thoughts on “Iconos de Suscripción “Social Drop” que giran al pasar el cursor

  • marzo 11, 2014 en 12:16 am
    Permalink

    Hola! Disculpa, ¿Tienes o podrías hacer una entrada donde menciones algunas alternativas de FEEDBURNER gratis? Tengo el problema de que feedburner no envía mis entradas nuevas y quisiera conocer alternativas para cambiar de servidor. Ojalá pudieras ayudarme. Saludos!! =D

    Responder
  • agosto 14, 2014 en 3:53 pm
    Permalink

    Es posible introducir instagram como gota de agua?
    Saludos. Gracias.

    Responder

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *