13 febrero 2013

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"

4 comentarios

Hola antonio, puedes poner estas redes sociales muy chulas para mi blog y quitar las de blanco y negro? gracias.

Gracias me encantan.. los he puesto.. son preciosos..! un saludo..

no redirige a ningún lugar.

Daniel, cual es exactamente tu problema?


Por favor, comente de acuerdo al tema del artículo.
Serán removidos todos los Comentarios con enlaces.
Si quieres recibir los nuevos comentarios marca "Avisarme"