En esta oportunidad les quiero compartir un pack de iconos sociales en forma de huevos que giran 360 grados al pasar el cursos sobre ellos.
En el pack vienen incluidos los iconos de Facebook, Google +, Twitter, RSS FEED y Yahoo!.
Pueden ver el truco funcionando aqui :
Para agregar este truco en tu blog pega en un elemento HTML/JavaScript lo siguiente:
<center><div id="socialicons"><a href="URL FACEBOOK" target="_blank"><img src="http://www.miltrucosblogger.com/wp-content/uploads/2012/07/facebook.png" /></a><a href="URL GOOGLE PLUS" target="_blank"><img src="http://www.miltrucosblogger.com/wp-content/uploads/2012/07/google-252B.png" /></a><a href="URL TWITTER" target="_blank"><img src="http://www.miltrucosblogger.com/wp-content/uploads/2012/07/twitter.png" /></a><a href="URL FEED" target="_blank"><img src="http://www.miltrucosblogger.com/wp-content/uploads/2012/07/rss.png" /></a><a href="URL YAHOO" target="_blank"><img src="http://www.miltrucosblogger.com/wp-content/uploads/2012/07/yahoo.png" /></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 solo cambia lo que esta en color azul por lo que se indica en cada caso.
Espero que les sea de agrado este pequeño truco y sigan visitando Mil Trcuos Blogger.
15 comentarios
Marcos · julio 17, 2012 a las 11:04 am
muy chulo, me encantó…
aquí mi blog:
destructorweb.blogspot.com
Juvinao · julio 19, 2012 a las 9:50 pm
Gracias Marcos por comentar, me da mucho gusto que los estes usando….
Saludos 😛
Softy PC · julio 18, 2012 a las 12:54 pm
Juviano. Gracias! pero te quiero preguntar una cosa. Cuantos años tienes?
Marcos · julio 19, 2012 a las 12:53 pm
para que quieres saber mis años?
Juvinao · julio 21, 2012 a las 12:12 am
Softy gracias a ti por comentar…
Marcos yo creo que pregunta es por mi edad :zombie:
Arty Alvarado · julio 19, 2012 a las 12:44 am
Ay que bonitos están, en una de estos y los pongo en mi blog http://dineroyyo.blogspot.com
Juvinao · julio 21, 2012 a las 12:11 am
Dale amigo usalos cuando quieras..
Saludos 😀
Lourdes · agosto 15, 2012 a las 1:51 pm
¡Muchas gracias!
Juvinao · agosto 15, 2012 a las 8:25 pm
:man:
Teresa Pérez Landa · septiembre 4, 2012 a las 5:25 pm
Una pregunta Juvinao, intento ponerlos, y la imagen funciona genial, pero cuando pinchas en ella no te lleva a ningún lado porque a donde redirecciona es a la dirección del blog y la de facebook juntas, por lo que, obviamente, no lleva a ningún lado… No sé qué hago mal, ¿alguna directriz? ¿Podrías ponerme el código html únicamente del huevito de facebook?
Un abrazote, me encanta tu blog!!
Juvinao · septiembre 4, 2012 a las 7:15 pm
Teresa mira para que el truco te funcione bien debes agregar la URL con el siguiente formato:
http://www.facebook.com/pages/Mil-Trucos-Blogger/174666062584624
Osea con el http:// y si la web lleva el www. tambien la debes agregar.
Teresa Pérez Landa · septiembre 17, 2012 a las 7:16 pm
Mil gracias Juvinao!! Ahora sí… qué bien!! Abrazotes 🙂
Juvinao · septiembre 17, 2012 a las 7:29 pm
De nada Teresa!,gracias por tu comentario y que bueno que hayas solucionado este problemilla 😛
EDUARDO JARPA · enero 22, 2013 a las 12:10 pm
MEN ESTA RE CHIDO COMO LO HAGO SI KISIERA PONR L DE YOTUBE ME LO PASAS
Hayder Juvinao · enero 23, 2013 a las 7:25 pm
Eduardo el problema es que no me acuerdo de que pack de imagenes los saque :(, espera un rato y los busco 😛