Menu Closed

Nya, como vão? Trago hoje um tutu que achei no blog Birthday então ai esta os devidos créditos, ele e um menu bem fofo, querem ver? Veja na brevia abaixo. E ai vamos tentar fazer?

Brevia do efeito

1. Vá em seu HTML e lá procure por ]]></b:skin>, achou? Otimo agora acima dele adicione este codigo:

Códigos

/*** MENU CLOSED POR BIRTHDAYCAKE ***/

.menuzinho {background: #eddcdc; color: #3e1010; font-family: 'ronda'; text-transform: uppercase; font-size: 8px; text-align: center; border-left: solid 6px #3e1010; width: 50%; padding: 3px; margin: 1px; spacing: 0px; display: inline-block; -webkit-transition-duration: .90s;}

.menuzinho:hover {background: #eddcdc; color: #3e1010; border-right: solid 6px #d83e76; border-left: solid 0px #d83e76; width: 50%; padding: 3px; margin: 1px; -webkit-transition-duration: .90s;} @font-face { font-family: "ronda"; src: url('http://static.tumblr.com/rmj06l2/kcLlo1q2y/pf_ronda_seven.ttf'); }

2. Salve, e crie uma Gadget HTML/Javascript e cole:

Códigos

<div class="menuzinho"><a href="URL_AQUI">Nome</a></div>

<div class="menuzinho"><a href="URL_AQUI">Nome</a></div>

<div class="menuzinho"><a href="URL_AQUI">Nome</a></div>

<div class="menuzinho"><a href="URL_AQUI">Nome</a></div>