Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa noite!
Pessoal, estou com uma certa dificuldade ao criar o meu menu com rollover, segue meu html e meu css:
<ul id="nav">
<li><a href="#"><span>home</span></a></li>
<li><a href="#"><span>empresa</span></a></li>
<li><a href="#"><span>produtos</span></a></li>
<li><a href="#"><span>serviços</span></a></li>
<li><a href="#"><span>parceiros</span></a></li>
<li><a href="#"><span>fotos</span></a></li>
<li><a href="#"><span>água</span></a></li>
<li><a href="#"><span>clientes</span></a></li>
<li><a href="#"><span>contato</span></a></li>
</ul>
/ menu /
header #content_header ul#nav {
width: auto;
float: left;
} float: left;
height: 48px;
list-style-type: none;
padding-left: 6px;
cursor: pointer;
} color: #144C80;
display: block;
font-size: 12px;
height: 44px;
padding-left: 12px;
text-decoration: none;
width: auto;
cursor: pointer;
font-weight: bold;
} cursor: pointer;
display: block;
height: auto;
padding: 12px 24px 27px 0px;
}
/ menu hover / active /
header #content_header ul#nav li:hover {
background: url("../images/links_nav_left.gif") no-repeat scroll left top transparent;
}background: #F4F3F3;
} background: url("../images/links_nav_right.gif") no-repeat scroll right top transparent;
}
O caso é o seguinte, como podem ver coloquei um bg para funcionar nas tags li, a, span. Fiz isso pois preciso que o espaço seja dinamico, pelo fato de termos aqui nomes de links uns maiores do que os outros. Dessa forma funciona, porém, bugado, se passarem o mouse na borda esquerda de qualquer um vão ver que aparece o bg desse elemento em si, se passo o mouse no a acontece o mesmo, no span o mesmo. Podem me dizer alguma outra forma de fazer funcionar essa ação de rollover que estou querendo fazer? Segue o endereço desse menu
Agradeço desde já a atenção.
Abraço!
>
Dá uma olhada na minha solução para o terceiro menu:
http://forum.imasters.com.br/topic/354140-repente-css-menus/page__p__1341165#entry1341165
Mano,
Segui lá sua orientação e rolou certinho =). Só não testei ainda nos IEs da vida ¬¬, haha
Dá uma olhada aí: juliograffin.com.br/develop/site/
Valeu a ajuda bróder!
Abraço!
eita.. mas pra q tanto span? hauhauha
lá eu resolvi so com o LI e o A.
você usou a do Thiago, a minha ta logo abaixo, hehe.. se quiser melhorar.. da uma olhada depois:
http://www.cenasordidas.hbe.com.br/desafios/terceiroMenu.html
>
eita.. mas pra q tanto span? hauhauha
lá eu resolvi so com o LI e o A.
você usou a do Thiago, a minha ta logo abaixo, hehe.. se quiser melhorar.. da uma olhada depois:
http://www.cenasordidas.hbe.com.br/desafios/terceiroMenu.html
husahushaushas nossssssss cara, então peguei o exemplo errado!
Bem que eu achei que tinha muito span, achei um solução meio deselegante na real. Mas beleza, vou melhorá-la.
Obrigado pela ajuda mano!
>
Bem que eu achei que tinha muito span, achei um solução meio deselegante na real.
é deselegante com certeza.. heheolha a minha.. tá bem feita, e testei nos ies :lol:
>
eita.. mas pra q tanto span? hauhauha
lá eu resolvi so com o LI e o A.
você usou a do Thiago, a minha ta logo abaixo, hehe.. se quiser melhorar.. da uma olhada depois:
http://www.cenasordidas.hbe.com.br/desafios/terceiroMenu.html
Eaí William!
Cara, então, segui o seu modelo, parece que num rolou legal pra mim, na verdade deu aquele bugzinho do hover em cima do LI, saca? Não entendi o porque?
Bem, dá uma olhada e vê o que acha. Ficou muuuito melhor meu html, mas não rebateu no desempenho, talvez faltou algo. :huh:
http://juliograffin.com.br/develop/site/
Valeu!
deu aquele bugzinho do hover em cima do LI, saca? Não entendi o porque?
ahh sim.. agora saquei.
Então cara, joga um li:hover também, ai você muda o bg durante ele. [note que tem essa regra no meu, e não tenho esse bug]
Dá uma olhada na minha solução para o terceiro menu:
http://forum.imasters.com.br/topic/354140-repente-css-menus/page__p__1341165#entry1341165