√ Iconos de Redes Sociales con efecto zoom para blogger - Amor Sevillista

Home redes trucos blog Iconos de Redes Sociales con efecto zoom para blogger

Iconos de Redes Sociales con efecto zoom para blogger

iconos de redes sociales

Anteriormente vimos como colocar unos Iconos de Redes Sociales en blanco y negro y ahora os muestro otros con efecto zoom.
Al igual que el anterior este gadget muestra una lista de íconos sociales que enlazan hacia cada uno de vuestros perfiles, pero a su vez estos íconos, ya colocados en el gadget, cambian cuando alguien pasa el cursor sobre ellos creando un efecto zoom, siendo muy atractivos para curiosos que no están acostumbrados a este tipo de diseños.

Para instalar estos íconos tendrás que seguir los siguientes pasos:
.- Entra al panel de control de tu blog, y luego a Diseño-añadir un gadget-HTML/Javascript, copia y pega el código de abajo.

<style>.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 65px;
height:60px;
}
.bubblewrap li img{
width: 55px;
height: 60px;
border:0;
margin-right: 12px;
-webkit-transition:-webkit-transform 0.1s ease-in;
-o-transition:-o-transform 0.1s ease-in;
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8);
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
} </style>
<div class='bubblewrap'>
<ul>
<li><a href='mailto:tuemail'><img src='https://lh6.googleusercontent.com/-n6jKMgYOMc8/URvdgAiS3dI/AAAAAAAAKL8/HU09XAlI3Cc/s165/digg_thumb%255B2%255D.png' title='Enviar Email'/></a></li>
<li><a href='dirección perfil google'><img src='https://lh5.googleusercontent.com/-WXbZTOObMx0/URvdinin59I/AAAAAAAAKMI/kauwmGDehPA/s165/goo.png' title='Síguenos en Google+'/></a></li>
<li><a href='dirección perfil facebook'><img src='http://lh4.ggpht.com/_7Y9pl24WpQY/TKYkLgpPqKI/AAAAAAAAEpE/MoiG31eV3gg/facebook_thumb%5B2%5D.png' title='Síguenos en Facebook'/></a></li>
<li><a href='dirección perfil twitter'><img src='http://lh6.ggpht.com/_7Y9pl24WpQY/TKYkGo-lIBI/AAAAAAAAEo0/v8uQduCj814/twitter_thumb%5B2%5D.png' title='Síguenos en Twitter'/></a></li>
<li><a href='dirección del feed '><img src='http://lh5.ggpht.com/_7Y9pl24WpQY/TKYkOKs2gnI/AAAAAAAAEpM/atV8KDhqKcI/rss_thumb%5B2%5D.png' title='Ver RSS'/></a></li>
</ul>
</div>

Configuración:
EMAIL: cambiar donde pone "tuemail"
GOOGLE+: cambiar donde pone "dirección perfil google"
FACEBOOK: cambiar donde pone "dirección perfil facebook"
TWITTER: cambiar donde pone "dirección perfil twitter"
RSS: cambiar donde pone "dirección del feed"

Tutoriales Gratis