01/02/2013

Tutorial: Menu Roll Right

||
-O dia que isso aconteser, toda Konoha foi devastada e eu em um hospício-

Ohayoooooo, como vão? Venho avisar que abri mais 25 vagas para afiliados, além daquelas outras 35.  Fui visitar alguns blogs afiliados meus e vi que muito deles tinham me tirado ou foram excluidos, então podem pedir. Mas agora vamos ao tutu do dia, trago um menu que acho super fofo e quero usar no meu próximo layout, ele se chama Roll Right créditos ao Worldesigns e KW. Caso queiram dar uma olhadinha no menu clique aqui ||Dentadas||. Gostaram? Então vamos ao tutorial.

Vá ate seu HTML e procure por ]]></b:skin>, assim que o achar acima dele adicione isso:

#menu{
background: url(http://static.tumblr.com/jyjxgdu/2Humbnktp/menu.png) right ;
width: 110px;
float: left;
height: 20px;
font: 20px Play;
color: #fff;
padding: 2px 0 6px 0;
text-align: center;border-radius: 7px;
margin: 5px;
text-transform: uppercase;
cursor: default;
-moz-transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
#menu:hover {
opacity: .95;
background: url(http://static.tumblr.com/jyjxgdu/2Humbnktp/menu.png) left ;
 color: #5f5147;
}

Arrume as  partes em negrito pelo o endereço de sua imagem, lembrando que as imagens devem ser o mesmo link. Agora vá ate seu layout e abra um gadget HTML/Javascript e cole o código:

<a href="link" id="menu">Link</a>

Espero que tenham gostado e ate mais tarde bunnys.

Nenhum comentário:

Postar um comentário

Hi guys!!!!
Hey aqui é Wendy, blogueira desde 2010! Viciada em animes, amante de livros e adora ver séries! Criei esse cantinho na intenção de ajudar na criação e personalização de blogs e sites.
Wattpad Facebook Tumblr Instagram