25/11/14

Iconos sociales en gota, que se dan la vuelta

Poner los iconos sociales en gota y que se den la vuelta, es pan comido.
Tanto que solo tenéis que copiar y pegar.

Podéis ver el efecto de girar en mi blog


Una vez más vais a plantilla - diseño - añadir html y pegais el siguiente código:

<center><div id="socialicons"><a href="https://www.facebook.com/profile.php?id=100006992655193" target="_blank"><img  src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCo8hQr7rkafGUUh_EGoyZn2yjMk70FTL6e4qhl5I6akFqzjxqmpUE0MBqR5ztWdL4Fnm58CGdiDfNtTIpuHwHEzsbrRP4kU89UYs9Uzap0NP-Mnl3oVXdBSqNZzthgN1Mm2zbHbMRlw7m/s1600/Facebook-64.png" /></a><a href="https://plus.google.com/108736969310273878584" target="_blank"><img  src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6SMuc-4a6HhcoVQj0EpBwmQeQKo5esh-tLLkHcGFOucM0xSDaF9MFCfPMyW4P-e7xGeN8uuOJCC6dzzLWzkrxRjZ2nwo3IuPDwtu-hCB5EkEOm_wsp07mWBytToR8DwVk1RKBSt-nTKwc/s1600/Google-64.png"  /></a><a href="https://twitter.com/yyosipuedo" target="_blank"><img  src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhy20QQIoq2WFJmOWYGNrgxY3ScU1T7nYdaMXF_de5Yj9ctZMLv4g67HocujHpG84_3ZgqkD4TrCGdUY1BZhck60XudGO8P1rUT9aJXD4QmMTggOdTHHaHLUMsBQKiGoUvOyRnhSQvAWG-X/s1600/Twitter-64.png"  /></a><a href="http://www.pinterest.com/anapereira7070/" target="_blank"><img  src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1ezOyBGRlasMKFPs_dujQdm-dEroRhyphenhyphenLESCSwBjp4uvlg6ZW3pCK4kkzNp67djTl0WYqzRddUafUFzYJRPm7cgcAd9S1o0y6-An3RDHOvyRZLiFwP3garJO4pAlF4xt_vC0K8wlp9yajC/s1600/Pinterest-64.png" /></a>
<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>
</div></center>
Espero que os haya sido útil, hasta pronto!!!

No hay comentarios:

Publicar un comentario