Inicio     Anuncie     Equipe     Parceria     Editar #
Icon Icon

Como Coloca Menu Hover no Blog - Menu com efeito


Com Imagens Reupadas Por Vitor C.I.A
E  ainda Centralizado ele nao fica torto ele fica aonde vc colocar ele
----------------------- 
Vamos Ao Tutorial


Primeiro vá no Blogger/ design/ Editar html.

aperte CTRL + F e procure por ]]></b:skin>

depois copie o código abaixo e cole acima do   ]]></b:skin>


/*-----Menu azu grande -----*/
#menuimagem{
width:100px;
height:100px;
display:block;
position:absolute;
margin:245px 0 0 25px;
}
#home {
background:url(http://i.imgur.com/NqWvf.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#home:hover {
background:url(http://i.imgur.com/HS6I5.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#HOME{
width:208px;
height:57px;
display:block;
position:absolute;
margin:-22px 0 0 20px;
}
#contato2 {
background:url(http://i.imgur.com/3Bt5V.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#contato2:hover {
background:url(http://i.imgur.com/r6QwN.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#CONTATO2{
width:208px;
height:57px;
display:block;
position:absolute;
margin:-22px 0 0 200px;
}
#parceria {
background:url(http://i.imgur.com/Sd3sj.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#parceria:hover {
background:url(http://i.imgur.com/ZZghD.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#PARCERIA{
width:208px;
height:57px;
display:block;
position:absolute;
margin:-22px 0 0 380px;
}
#anuncie {
background:url(http://i.imgur.com/cL5ic.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#anuncie:hover {
background:url(http://i.imgur.com/hBzrc.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#ANUNCIE{
width:208px;
height:57px;
display:block;
position:absolute;
margin:-22px 0 0 560px;
}
#equipe {
background:url(http://i.imgur.com/crnVs.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#equipe:hover {
background:url(http://i.imgur.com/AKY0B.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#EQUIPE{
width:208px;
height:57px;
display:block;
position:absolute;
margin:-22px 0 0 741px;
}
/*-----Menu azu grande fim -----*/



e abaixo de <body> cole o codigo abaixo mudando os links valew
depois visualize e se estiver file vc salva

<table align='center' border='0' cellpadding='0' cellspacing='0' width='1000'> 
<tr>
    <th scope='col'>
<div id='menuimagem'>
<div id='HOME'>
<a href='http://megadesignermd.blogspot.com.br/' id='home' title='Volte Para a Pagina Inicial'/>
</div>
<div id='CONTATO2'>
<a href='http://megadesignermd.blogspot.com.br/search/label/contato' id='contato2' title='Entre em Contato !'/>
</div>
<div id='PARCERIA'>
<a href='http://megadesignermd.blogspot.com.br/search/label/parceria' id='parceria' title='Faça Parceria !'/>
</div>
<div id='ANUNCIE'>
<a href='http://megadesignermd.blogspot.com.br/search/label/pedidos' id='anuncie' title='Faça Sua Propaganda !'/>
</div>
<div id='EQUIPE'>
<a href='http://megadesignermd.blogspot.com.br/search/label/seja%20da%20equipe' id='equipe' title='Faça Seu Pedido !'/>
</div>
<div id='FAQ'>
<a href='bleach@live.com/' id='faq' title='Dúvidas ?  Retire - a Agora mesmo !'/>
</div>
</div>
</th>
 </tr>
</table>


Creditos: Vitor C.I.A Completo Create
Por favor não Retirem creditos valew rapaziada
C Gostou / Por Favor Comente 

0

0 comentários:

Postar um comentário