Menú con efecto burbuja css3 sin javascript

closeHola! hace 7 years 17 days que escribí esta entrada, puede que esta información ya no sea valida en la actualidad, por favor se comprensivo conmigo cuando comentes 🙂

Un ejemplo básico de un menú usando css3, funciona en las ultimas versiones de Safari, Chrome y Firefox.

.contenedor_b{
list-style-type:none;
margin:0;
padding:0;
}
 
.contenedor_b li{
display:inline;
width: 65px;
height:60px;
}
 
.contenedor_b 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; 
}
 
.contenedor_b li img:hover{
-moz-transform:scale(1.8); 
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
<ul class="contenedor_b">
<li><a href="http://jodacame.com"><img src="fb.png" title="Add to Facebook" /></a></li>
<li><a href="http://jodacame.com"><img src="rss.png" title="Add to RSS Feed" /></a></li>
<li><a href="http://jodacame.com"><img src="twitter.png" title="Add to Twitter" /></a></li>
<li><a href="http://jodacame.com"><img src="youtube.png" title="Add to Youtube" /></a></li>
</ul>



You may also like...

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *