Hola amigos de Mil Trucos Blogger, en el día de hoy voy a compartir un menú sencillo para Blogger, que al pasar el cursor encima se descubre un gran efecto zoom.

Sencillo nenú horizontal con efecto zoom

Para agregar este menú solo debes ir a Diseño, Añadir gadget, HTML/JavaScript (preferiblemente en el gadget ubicado debajo de la cabecera) y pegar el siguiente código:

<style>
ul.arrowunderline{
list-style-type:none;
margin:0;
padding:0;
text-align:center;
font-size:16px;
}
ul.arrowunderline li{
display:inline;
margin-right:12px;
}
ul.arrowunderline li a{
position:relative;
color:orange;
padding-bottom:3px;
text-decoration:none;
}
ul.arrowunderline li a:hover{
font-weight:bold;
font-style:italic;
font-size:20px;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
ul.arrowunderline li a:hover:after{
content:'';
width:0;
height:0;
position:absolute;
left:50%;
margin-left:0px;
bottom: 0;
border-width:0px;
border-style:solid;
border-color: transparent transparent red transparent;
}
</style>
<ul class="arrowunderline">
<li><a href="URL del enlace">Inicio</a></li>
<li><a href="URL del enlace">Perfil</a></li>
<li><a href="URL del enlace">Rss</a></li>
<li><a href="URL del enlace">Facebook</a></li>
<li><a href="URL del enlace">Twitter</a></li>
<li><a href="URL del enlace">Google+</a></li>
</ul>

La parte resaltada en color azul corresponde al HTML que se puede editar.

Si el truco te ha gustado no olvides compartirlo en tus redes sociales.