Home About Affies Afiliame Tutorials
5.12.13

Tutorial: Menú Shadow



Hola! Hoy traigo un tutorial de The circus:
Preview



  1. Vamos a Diseño
  2. Añadir un Gadget 
  3. Html/JavaScript
  4. Y pegamos el siguiente código: 

<style>
.menuSC a{
font-family: arial;
font-size: 13px;
padding:3px;
letter-spacing: 2px;
box-shadow: inset 9px 0 0px 0 #fff;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
margin:1px;
display:block;
text-align:center;
background: #fff;
color: #DD94FA; /* COLOR DE LETRA */
width: 160px; /* ANCHO DEL MENÚ */
border-right:10px solid #fff; /* BORDE DERECHO */
border-left:10px solid #C1FFFF; /* BORDE IZQUIERDO */
overflow: hidden;</div>
text-decoration: none; text-shadow: 0px 0px 0px #fff;
}
.menuSC a:hover{
box-shadow: inset 1000px 0 0px 0 #F4FFC4;
color: #fff; /* COLOR DE LETRA {HOVER} */
border-right:10px solid #FFDAFD; /* BORDE DERECHO {HOVER} */
border-left:50px solid #FFF475; /* BORDE IZQUIERDO {HOVER} */
text-decoration: none; text-shadow: 0px 0px 0px #fff;</div>
}
</style>
<div class="menuSC">
<a href="LINK"> Title</a>
<a href="LINK"> Title</a>
<a href="LINK"> Title</a>
<a href="LINK"> Title</a>
<a href="LINK"> Title</a>
</center>
</div>
Actualizado el 27 de Febrero 2014

Eso es todo 

4 comentarios:

Escribe tu comentario pequeño friki :3
Recuerda que me haces muy feliz si no haces:
·Spam
·Insultos
·Anónimos ofensivos
·etc.
·Y por favor escribe algo que se pueda entender