Menu deslizante

Hayoo, boa tarde ! Essa postagem também é programada, porque agora estou no ballet :x
como havia dito antes, trouxe mais um tutorial. Dessa vez é de um menu bem simples que achei no KW. O menu é daqueles bem pequenos e pra mim fica muito bonito em status e coisas que não precisem chamar tanta atenção assim. É bem simples de ser personalizado e aplicado, então não se preocupem com nada. 
1. Vá até editar HTML e procure por ]]></b:skin>. Acima do código encontrado, cole:

.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;}



Troque as partes em negrito pelo que elas representam e depois salve.


2. Em um gadget de HTML/JavaScript, cole:

<div class="heart"> Seu texto </div>

Digite o que quiser no espaço indicado e depois salve. Seu menu estará pronto.

4 comentários: