Anderson Santos 0 Denunciar post Postado Janeiro 9, 2006 Bom dia, pessoal Tenho um layout tableless e um menu com estilos aplicados à tag A e A:hover. Abaixo do menu de texto há imagens referentes à esses itens que eu queria que, ao receber um evento onmouseover alterasse também o estilo do texto de menu relacionado. Vocês sabem como eu poderia fazer para alterar o estilo do texto do menu, ou que outra forma eu poderia estruturar. O layout está mais ou menos assimTextoMenu1 TextoMenu2 TextoMenu3|Imagem1| |Imagem2| |Imagem3| Compartilhar este post Link para o post Compartilhar em outros sites
ursolouco 0 Denunciar post Postado Janeiro 9, 2006 Brother!! Uma possivel solução é você desenvolver um javascript que altere o estilo (objeto.className) do <div> em que está seu menu aplicando a formatação desejada. Um exemplo boca de porco é este aqui: <style type="text/css"> div#menu { padding: 5px; border-bottom-style: solid; border-bottom-color: #CCCCCC; border-bottom-width: 1px; } #menu ul { padding: 0px; margin: 0px; } #menu ul li { list-style-type: none; display: inline; } div.navegacao { color: #000000; } .navegacao ul { padding: 0px; margin: 0px; visibility: hidden; } .navegacao ul li { list-style-type: none; display: inline; } div.azul{ color: #000099; visibility: visible; } .azul ul { padding: 0px; margin: 0px; } .azul ul li { list-style-type: none; display: inline; } </style><script language="javascript" type="text/javascript"> function setClassName(objId, className){ document.getElementById(objId).className = className; }</script><div id="menu"> <ul> <li><a href="#" onmouseover="setClassName('navegacao','azul');">Produtos</a></li> <li>|</li> <li><a href="#">Catalogo</a></li> <li>|</li> <li><a href="#">Loja</a></li> <li>|</li> <li><a href="#">Entrega</a></li> </ul></div><div id="navegacao" class="navegacao" onmouseout="setClassName('navegacao','navegacao');"> <ul> <li>Texto</li> <li>|</li> <li>Texto</li> <li>|</li> <li>Texto</li> <li>|</li> <li>Texto</li> </ul></div> Abraços!! Compartilhar este post Link para o post Compartilhar em outros sites
Anderson Santos 0 Denunciar post Postado Janeiro 9, 2006 Hummmm, acho que com ajustes no meu código esse daí vai funcionar.Valeu =) Brother!!Uma possivel solução é você desenvolver um javascript que altere o estilo (objeto.className) do <div> em que está seu menu aplicando a formatação desejada.Um exemplo boca de porco é este aqui: <style type="text/css"> div#menu { padding: 5px; border-bottom-style: solid; border-bottom-color: #CCCCCC; border-bottom-width: 1px; } #menu ul { padding: 0px; margin: 0px; } #menu ul li { list-style-type: none; display: inline; } div.navegacao { color: #000000; } .navegacao ul { padding: 0px; margin: 0px; visibility: hidden; } .navegacao ul li { list-style-type: none; display: inline; } div.azul{ color: #000099; visibility: visible; } .azul ul { padding: 0px; margin: 0px; } .azul ul li { list-style-type: none; display: inline; } </style><script language="javascript" type="text/javascript"> function setClassName(objId, className){ document.getElementById(objId).className = className; }</script><div id="menu"> <ul> <li><a href="#" onmouseover="setClassName('navegacao','azul');">Produtos</a></li> <li>|</li> <li><a href="#">Catalogo</a></li> <li>|</li> <li><a href="#">Loja</a></li> <li>|</li> <li><a href="#">Entrega</a></li> </ul></div><div id="navegacao" class="navegacao" onmouseout="setClassName('navegacao','navegacao');"> <ul> <li>Texto</li> <li>|</li> <li>Texto</li> <li>|</li> <li>Texto</li> <li>|</li> <li>Texto</li> </ul></div>Abraços!! Compartilhar este post Link para o post Compartilhar em outros sites