Tutorial: Iconos sociales que giran al pasar el cursor.

GaboTs Seguir

Épsilon
Social Media
Desde
30 Nov 2013
Mensajes
929
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
3d.png

En este tutorial aprenderemos como agregar iconos sociales que giran al pasar el cursor, es muy fácil solo sigue los pasos.




PASO 1

Vamos a "DISEÑO"

oW5gwe4.png


PASO 2

Click en "Añadir Gadget" Y luego buscamos "HTML/Javascript"

gvHJjuU.png


HTML/Javascript

ursGgPT.png



Y una ves ahí adentro copiamos y pegamos el siguiente codigo

Insertar CODE, HTML o PHP:
<style>
#ayudadeblogger_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;
}

#ayudadeblogger_socialicons img:hover {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}
</style>

<center><p id="ayudadeblogger_socialicons">
    <a href="http://www.facebook.com/[COLOR="#FF0000"]TU PAGINA DE FACEBOOK[/COLOR]"><img src="http://3.bp.blogspot.com/-eG9bPvyOXro/UPBYTmI8VEI/AAAAAAAAJqI/TFBZzBxJ59c/s1600/NBT+facebook+icon.png" /></a>

    <a href="http://www.twitter.com/[COLOR="#FF0000"]TU TWITTER[/COLOR]"><img src="http://4.bp.blogspot.com/-dB0P2JmL6QA/UPBYVfvhyII/AAAAAAAAJqU/HFD5UeTJck8/s1600/NBT+twitter+icon.png" /></a>

    <a href="https://plus.google.com/[COLOR="#FF0000"]TU GOOGLE +[/COLOR]"><img src="http://1.bp.blogspot.com/-XU8OI90JZQc/UPBYUKmev_I/AAAAAAAAJqM/FPgdcMimraQ/s1600/NBT+google+plus+icon.png" /></a>

    <a href="http://www.feeds.feedburner.com/[COLOR="#FF0000"]TU FEED[/COLOR]"><img src="http://4.bp.blogspot.com/-YPkJD-sewC8/UPBYWk9dzBI/AAAAAAAAJqg/D3FVlAJz4VE/s1600/NBT+rss+feed+icon.png" /></a></p></center>


Y despues le damos en "GUARDAR"

yevyHQf.png


Eso ah sido todo

Más adelante les traeré tutos mejores..... ¡ESPERENLOS!
 

Don Gato

Eta
Redactor
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
23 Oct 2012
Mensajes
1.292
Me gusta, simples y elegantes a la misma vez :encouragement:
Gracias me lo guardo.
 

kibrot

Dseda
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
10 Dic 2012
Mensajes
1.158
Gracias se miran muy bien en mi blog
 
Última edición:

Sonyco

Iota
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
Verificado por Binance
Desde
30 May 2014
Mensajes
2.173
Muy elegantes, buen tuto! ;)

---------- Post agregado el 21-jun-2014 hora: 05:01 ----------

Amigo le da un detalle soberbio (Me acorde de burro en Shrek 1 jaajaj) No tiene el icono pero de Youtube?
 
Arriba