Seguidores

sexta-feira, 26 de outubro de 2012

Tutorial-Menu Lollipop

 

Ola amores,hoje trouxe um tutorial meio complicado,mas se fizerem com calma vai dar tudo certo.


Bom vamos começar?



1-Vá até Modelo> Editar HTML e procure por ]]></b:skin> acima da tag cole:


#lollipop{
-webkit-transition-duration: 1.0s;
font-family:'Play';
font-size:12px;
}
#lollipop .color1 a{
background:#616161;
display: block;
padding:5px 210px 5px 7px;
position:absolute;
-webkit-transition-duration: .50s;
color:#fff;
text-shadow:1px 1px 0px #414040;
border:1px solid #5c595a;
-moz-box-shadow: inset 0 0 10px #414040;
-webkit-box-shadow: inset 0 0 10px #414040;
box-shadow: inset 0 0 10px #414040;
}
#lollipop .color1 a:hover{
background:#646363;
display: block;
padding:5px 210px 5px 7px;
margin-left:-5px;
position:absolute;
-webkit-transition-duration: .50s;
color:#fff;
text-shadow:1px 1px 0px #414040;
}



2-Adc um Gadget HTML/JavaScript e nele cole:

<div id="lollipop">< div class="color1"><a href="seulink.com">Nome do Link</a></div> <br />

< /div>


Vc verá uma linha ja pronta.Para fazer a proxima de outra cpr,vc precisa fazer sse tutorial 2 vezes.


Ae lembre-se vc irá precisar posicionar manualmente pois o menu não fica um em baixo do outro.


Para ficar,adicione nas outras vezes:


margin-top: 12px;



e configure ate achar a posição que vc deseja.
é so meus amores eu espero que tenham gostado do tutorial,ae ja ia me esquecendo créditos a kawaii-world os códigos foram pegados de la.



2-Adc um Gadget HTML/JavaScript e nele cole:

<div id="lollipop">< div class="color1"><a href="seulink.com">Nome do Link</a></div> <br />

< /div>


Vc verá uma linha ja pronta.Para fazer a proxima de outra cpr,vc precisa fazer sse tutorial 2 vezes.


Ae lembre-se vc irá precisar posicionar manualmente pois o menu não fica um em baixo do outro.


Para ficar,adicione nas outras vezes:


margin-top: 12px;



e configure ate achar a posição que vc deseja.
é so meus amores eu espero que tenham gostado do tutorial,ae ja ia me esquecendo créditos a kawaii-world os códigos foram pegados de la.

Nenhum comentário:

Postar um comentário