Menu Rotate

| |
Tumblr_lrfo6qtev01qb57q7o1_500_large
Yoo!!!
então novo tuto esse daqui é de como fazer um menu rotate espero que estejam gostando dos tutoriais aqui do blog esse tuto eu aprendi lá no Kawaii Word um blog que todos conhecem né então vamos logo ao tuto:

1. Vá até editar HTML e procure por ]]></b:skin>. Acima da tag, cole o código do modelo que escolheu.

Rosa
.menugirarosa {width:auto; float:left}
.menugirarosa a {width:46px; font-family:handy; font-size:8px; color:#ffffff; text-decoration:none; background-color:#fdcddc; margin-top:5px;box-shadow: inset 0 0 30px #f08cb9, 0 0 2px #dd6a9d; text-align:center; padding:5px; -webkit-transition-duration: 1s; float:left; margin-left:3px;}
.menugirarosa a:hover {-webkit-transform: rotateX(-360deg);}


Azul
.menugiraazul {width:auto; float:left}
.menugiraazul a {width:46px; font-family:handy; font-size:8px; color:#ffffff; text-decoration:none; background-color:#cde8fd; margin-top:5px;box-shadow: inset 0 0 30px #9ecdf1, 0 0 2px #7cb6e3; text-align:center; padding:5px; -webkit-transition-duration: 1s; float:left; margin-left:3px;}
.menugiraazul a:hover {-webkit-transform: rotateX(-360deg);}


Amarelo
.menugira {width:auto; float:left}
.menugira a {width:46px; font-family:handy; font-size:8px; color:#ffffff; text-decoration:none; background-color:#fff9b1;box-shadow: inset 0 0 30px #d4cd82, 0 0 2px #cbc263; text-align:center; padding:5px; -webkit-transition-duration: 1s; float:left; margin-left:3px;}
.menugira a:hover {-webkit-transform: rotateX(-360deg);} 

2. Agora, em um gadget de HTML/JavaScript, cole o código referente a cor que escolheu:

 Rosa
<div class="menugirarosa">
<a href="LINK">nome</a>
<a href="LINK">nome</a>
<a href="LINK">nome</a>
<a href="LINK">nome</a>
</div>


Azul 
<div class="menugiraazul">
<a href="LINK">nome</a>
<a href="LINK">nome</a>
<a href="LINK">nome</a>
<a href="LINK">nome</a>
</div>


Amarelo 
<div class="menugira">
<a href="LINK">nome</a>
<a href="LINK">nome</a>
<a href="LINK">nome</a>
<a href="LINK">nome</a>
</div>
simples não é!!!espero que tenham gostado bjuus t+++

Nenhum comentário:

Postar um comentário