quarta-feira, 24 de julho de 2013

Tutorial: Menu hover deslizante


1 Vá até seu HTML e procure por ]]></b:skin>. Acima dessa tag cole esse código:
.heart {display : block; font-size: 10px;font-family: Tahoma;letter-spacing : 0;border-bottom : 1px solid #eee;background-repeat : no-repeat;   text-indent : 5px;vertical-align : middle;text-decoration : none; line-height : 15px;margin-bottom : 1px;padding-left : 3px; -webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;border-left: solid #CORDABORDA;background: #CORDOFUNDO; color: #666 !important;}.heart:hover {display : block;text-decoration: none; vertical-align: middle;line-height: 15px;background: #CORDOFUNDOHOVER; border-left: solid #CORDABORDAHOVER; padding-left: 15px;}
 2 Coloque as cores que deseja onde esta em negrito, salve e vá para Layout.  Criem gadget de HTML/JavaScript, cole: 


<div class="heart"> Seu texto </div>
Escreva o que quiser onde esta escrito "Seu Texto", se quer adicionar mais e só repetir o código colocando um abaixo do outro, assim:
<div class="heart"> Seu texto </div><div class="heart"> Seu texto </div><div class="heart"> Seu texto </div>

Nenhum comentário:

Postar um comentário