Menu Tree

[Giovani 104]

Fala pessoal,

 

Estou com a seguinte dúvida.

Nesse link consegui, depois de muitas tentativas, fazer o menu funcionar. Ele está da maneira que eu quero, exceto em uma coisa:

 

Quando clico no Itens 1 o menu abre embaixo corretamente, mas ai quando clico no Itens 2 o menu correspondente tb abre embaixo, mas o submenu do Itens 1 continua aberto.

 

Gostaria de clicar no Itens 1 e após, quando clicar no Itens 2, o submenu do Itens 1 "desapareça" e o do Itens 2 apareça!

 

Alguém pode ajudar?

 

[]'s

[Giovani 104]

Fala Thiago, tudo tranquilo?

 

Tá i meu código:

 

<script>	function Menu(id)	{		//criação da variável filho que recebe os nós (tags) filhos do item que foi clicado		var filho = id.parentNode.getElementsByTagName("ul");		//se a classe do nó filho estiver fechada ele abre o menu...		if(filho[0].className == "fechado")		{			filho[0].className = "aberto";//muda a classe			id.className="mAberto";//muda a figura do do nó		}		else		{			filho[0].className = "fechado";//muda a classe			id.className="mFechado";//muda a figura do do nó		}	}	</script>

E ai no arquivo fica assim:

<ul>				<li ><a href="#" onclick="Menu(this)" class="mFechado">Itens 1</a>					<ul class="fechado">						  <li><a href="#" onclick="Menu(this)" class="mFechado">Itens 1.1</a>							<ul class="fechado">								  <li><a href="#" class="subMenu">Itens 1.1.1</a></li>								  <li><a href="#" class="subMenu">Itens 1.1.2</a></li>								  <li><a href="#" class="subMenu">Itens 1.1.3</a></li>							</ul>						  </li>						  <li><a href="#" class="subMenu">Itens 1.2</a></li>						  <li><a href="#" class="subMenu">Itens 1.3</a></li>						  <li><a href="#" class="subMenu">Itens 1.4</a></li>					</ul>			   </li>			   			   <li ><a href="#" onclick="Menu(this)" class="mFechado">Itens 2</a>					<ul class="fechado">						  <li><a href="#" class="subMenu">Itens 2.1</a></li>						<li><a href="#" onclick="Menu(this)" class="mFechado">Itens 2.2</a>							<ul class="fechado">								  <li><a href="#" class="subMenu">Itens 2.2.1</a></li>								  <li><a href="#" class="subMenu">Itens 2.2.2</a></li>								  <li><a href="#" class="subMenu">Itens 2.2.3</a></li>							</ul>						  </li>						  <li><a href="#" class="subMenu">Itens 2.3</a></li>						  <li><a href="#" class="subMenu">Itens 2.4</a></li>					</ul>			   </li>			   			   <li><a href="#" onclick="Menu(this)" class="mFechado">Itens 3</a>					<ul class="fechado">						  <li><a href="#" class="subMenu">Itens 3.1</a></li>						<li><a href="#" class="subMenu">Itens 3.2</a></li>						<li><a href="#" onclick="Menu(this)" class="mFechado">Itens 3.3</a>							<ul class="fechado">								  <li><a href="#" class="subMenu">Itens 3.3.1</a></li>								  <li><a href="#" class="subMenu">Itens 3.3.2</a></li>								  <li><a href="#" class="subMenu">Itens 3.3.3</a></li>							</ul>						  </li>						  						  <li><a href="#" class="subMenu">Itens 3.4</a></li>					</ul>			   </li>			   			</ul>

Como não entendo nada de JS....fica a dúvida, tem como alterar o código para fazer o que eu quero?

[Giovani 104]

Sem comentários!!! http://forum.imasters.com.br/public/style_emoticons/default/blush.gif

 

MUITO OBRIGADO!!!! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Giovani 104]

Fala galera, aqui estou eu novamente....

O menu tá funcionando que é uma beleza.....mas me surgiu uma dúvida, se eu quiser colocar div´s no submenus ao invés de Itens1.1, itens1.2, isso é viável?

 

Tentei da seguinte maneira:

<li ><a href="#" onclick="Menu(this, 'm')" class="mFechado">Itens 2</a>			  <div id="teste">		   blablabla	   </div></li>

Claro que não funcionou..... <_<

Alguem pode ajudar?