18 de março de 2012

Como colocar menu hover no blog ?

Luiz






1° vá no Blogger/ design/ Editar html.
2 °aperte CTRL + F e procure por ]]></b:skin>
3 ° depois copie o código abaixo e cole acima do ]]></b:skin>


/*-----Menu Imagem-----*/
#menuimagem{
width:100px;
height:100px;
display:block;
position:absolute;
margin:399px 0 0 150px;
}
#home {
background:url(http://danielvale.webs.com/RG7%20CREATE/Inicio%201.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#home:hover {
background:url(http://danielvale.webs.com/RG7%20CREATE/Inicio%202.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://danielvale.webs.com/RG7%20CREATE/Contato%201.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#contato2:hover {
background:url(http://danielvale.webs.com/RG7%20CREATE/Contato%202.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://danielvale.webs.com/RG7%20CREATE/Parceria%201.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#parceria:hover {
background:url(http://danielvale.webs.com/RG7%20CREATE/Parceria%202.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://danielvale.webs.com/RG7%20CREATE/Anuncie%201.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#anuncie:hover {
background:url(http://danielvale.webs.com/RG7%20CREATE/Anuncie%202.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://danielvale.webs.com/RG7%20CREATE/Equipe%201.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#equipe:hover {
background:url(http://danielvale.webs.com/RG7%20CREATE/Equipe%202.png) no-repeat;
width:173px;
height:70px;
float:left;
}
#EQUIPE{
width:208px;
height:57px;
display:block;
position:absolute;
margin:-22px 0 0 741px;
}




depois copie o proximo código e cole no lugar do header que fica próximo de <body>
(pode variar de template a template)




<div id='menuimagem'>
<div id='HOME'>
<a href='http://www.busterdesigner.com.br' id='home' title='Volte Para a Pagina Inicial'/>
</div>
<div id='CONTATO2'>
<a href='bleachxd@live.com/' id='contato2' title='Entre em Contato !'/>
</div>
<div id='PARCERIA'>
<a href='http://www.busterdesigner.com.br/2011/12/parceria.html' id='parceria' title='Faça Parceria !'/>
</div>
<div id='ANUNCIE'>
<a href='http://www.busterdesigner.com.br' id='anuncie' title='Faça Sua Propaganda !'/>
</div>
<div id='EQUIPE'>
<a href='http://busterdesigner.blogspot.com/2011/12/faca-seu-pedido.html' 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>





0 comentários:

Postar um comentário