Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

B&D Informatica

Erro ao mostrar e ocultar Div

Recommended Posts

Olá amigos do forum,

 

Estou precisando colocar um efeito para mostrar div e ocultar a div ao clicar no menu.

 

Segue link do site www.truqys.com.br (botão produtos)

 

Esta funcionando porem precisar clicar 2x para que o sub-menu apareça.

 

Segue o código que estou utilizando.

 

 

<script type="text/javascript">
function exibe(id) {
	if(document.getElementById(id).style.display=="none") {
		document.getElementById(id).style.display = "inline";
	}
	else {
		document.getElementById(id).style.display = "none";
	}
}
</script>

HTML

 

<div id="topo">
	<div id="menu">
    <img src="lib/img/menu-topo.png" width="955" height="205" usemap="#Map" border="0" />
    <map name="Map" id="Map">
      <area shape="rect" coords="33,71,126,111" href="http://www.truqys.com.br/site/sobre-a-truqys" />
      <area shape="rect" coords="164,71,278,114"  onclick="javascript: exibe('sub-menu-produtos');" />
      <area shape="rect" coords="672,73,748,108" href="http://www.truqys.com.br/dicas/teste" />
      <area shape="rect" coords="776,75,924,110" href="http://www.truqys.com.br/contato" />
      <area shape="poly" coords="364,162,442,192,528,186,600,154,623,113,588,53,488,31,425,34,342,71,329,120" href="index.htm" />
    </map>
    
    <div id="sub-menu-produtos"><img src="lib/img/menu-topo_produtos.png" width="309" height="34" usemap="#produtos" border="0" />
      <map name="produtos" id="produtos">
        <area shape="rect" coords="31,5,98,31" href="http://www.truqys.com.br/gato/comedouro-quad" />
        <area shape="rect" coords="123,4,209,31" href="http://www.truqys.com.br/passaro/balanco" />
        <area shape="rect" coords="239,6,291,29" href="http://www.truqys.com.br/cao/bebedouro-osso" />
      </map>
    </div>
    
  </div>
  
  
  
</div>

Obrigado pela ajuda de todos

Compartilhar este post


Link para o post
Compartilhar em outros sites

Faça com jQuery amigo, bem mais simples. Escreva menos.
Faça as alterações e incorpore o jQuery em sua página.

 

 

HTML
<area shape="rect" coords="164,71,278,114" id="exibe" />


JAVASCRIPT
$(function(){
$("#exibe").click(function()[
if(document.getElementById(id).style.display=="none") { document.getElementById(id).style.display = "inline"; } else { document.getElementById(id).style.display = "none"; }
});
});

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.