Menu Drop

[Jorge Jardim 0]

Galera, pesso ajude de v6s com um menu. São dois problemas:

 

1º - o texto do submenu desaparece mas o fundo não.

2º - na função "quit" o onfocus e o onmouseover não funcionam.

 

Abaixo esta o codigo do menu:

 

<script type="text/javascript">function on(id) {	for (i=0; i<el.length; i++) {		//esconde os submenus		v = el[i].id;		if(v.indexOf('.')!=-1) 			el[i].className = "menu-no";		//pega o id do pai maior		p = id.slice(0,id.indexOf('.'))		//mostra os pais		if(v.length<=id.length) 			if(v.slice(0,v.indexOf('.'))==p) 				el[i].className = "menu-yes";		//mostra filhos		s1 = id.split('.');		t1 = s1.length+1;		s2 = v.split('.');		t2 = s2.length;		b  = id+'.';		if(t1>=t2)			if(v.indexOf(b)==0) 				el[i].className = "menu-yes";	}	clearTimeout(q)	q = setTimeout('quit()',2000)}function quit() {	for (i=0; i<el.length; i++) {		if((el[i].onfocus)||(el[i].onmouseover)) {   //esta parte tb nao esta funcionando			return setTimeout('quit()',2000)		} else {			return init()		}	}}function init() {	q = false;	el = document.getElementById("menus").getElementsByTagName("LI");	for (i=0; i<el.length; i++) {		v = el[i].id;		if(v.indexOf('.')!=-1)			el[i].className = "menu-no";	}}window.onload = init;</script><style type="text/css">body { 	margin: 0;	padding: 0;	font: normal 62.5% verdana;	background-color:#99CC66;}/* css default */ul#menus,ul#menus ul {	margin: 0;	padding: 0;	width: 150px; /* Largura dos menus pais */	font-size: 100%;}/* posiciona as lis */ul#menus li {	border-bottom: 1px solid #CCCCCC;	background: #FFFFFF; /* IE6 Bug */	position: relative;	list-style: none;	}/* default link no estado inicial */ul#menus li a {	display: block;	text-decoration: none;	color: #666666;	padding: 5px;	border-bottom: 0;	}/* Fix IE. Hide from IE Mac \*/* html ul#menus li { float: left; height: 1%; }* html ul#menus li a { height: 1%; }/* End *//* posiciona os submenus */ul#menus ul {	position: absolute;	left: 149px; /* 1px sobre o menu pai */	top: 0;	}/* exibe o submenu do pai selecionado */ul#menus li a:hover {	display: block;	text-decoration: none;	color: #FF0000;	padding: 5px;	border-bottom: 0;	background: #0066FF; /* IE6 Bug */	}	.menu-yes {	display: block;}.menu-no {	display: none;}</style><div id="menu">   <ul id="menus"> 	<li id="1"><a href="#" onfocus="on('1')" onmouseover="on('1')">1</a></li> 	<li id="2"><a href="#" onfocus="on('2')" onmouseover="on('2')">2</a></li> 	<li id="3"><a href="#" onfocus="on('3')" onmouseover="on('3')">3</a> 	  <ul> 		<li id="3.1"><a href="#" onfocus="on('3.1')" onmouseover="on('3.1')">3.1</a></li> 		<li id="3.2"><a href="#" onfocus="on('3.2')" onmouseover="on('3.2')">3.2</a></li> 		<li id="3.3"><a href="#" onfocus="on('3.3')" onmouseover="on('3.3')">3.3</a>		  <ul> 			<li id="3.3.1"><a href="#" onfocus="on('3.3.1')" onmouseover="on('3.3.1')">3.3.1</a>			  <ul> 				<li id="3.3.1.1"><a href="#" onfocus="on('3.3.1.1')" onmouseover="on('3.3.1.1')">3.3.1.1</a></li> 				<li id="3.3.1.2"><a href="#" onfocus="on('3.3.1.2')" onmouseover="on('3.3.1.2')">3.3.1.2</a></li> 				<li id="3.3.1.3"><a href="#" onfocus="on('3.3.1.3')" onmouseover="on('3.3.1.3')">3.3.1.3</a></li> 			  </ul> 			</li> 			<li id="3.3.2"><a href="#" onfocus="on('3.3.2')" onmouseover="on('3.3.2')">3.3.2</a></li> 			<li id="3.3.3"><a href="#" onfocus="on('3.3.3')" onmouseover="on('3.3.3')">3.3.3</a>			  <ul> 				<li id="3.3.3.1"><a href="#" onfocus="on('3.3.3.1')" onmouseover="on('3.3.3.1')">3.3.3.1</a></li> 				<li id="3.3.3.2"><a href="#" onfocus="on('3.3.3.2')" onmouseover="on('3.3.3.2')">3.3.3.2</a></li> 				<li id="3.3.3.3"><a href="#" onfocus="on('3.3.3.3')" onmouseover="on('3.3.3.3')">3.3.3.3</a></li> 			  </ul> 			</li> 		  </ul> 		</li> 	  </ul> 	</li> 	<li id="4"><a href="#" onfocus="on('4')" onmouseover="on('4')">4</a> 	  <ul> 		<li id="4.1"><a href="#" onfocus="on('4.1')" onmouseover="on('4.1')">4.1</a></li> 		<li id="4.2"><a href="#" onfocus="on('4.2')" onmouseover="on('4.2')">4.2</a></li> 		<li id="4.3"><a href="#" onfocus="on('4.3')" onmouseover="on('4.3')">4.3</a></li> 	  </ul> 	</li>   </ul> </div>

[micox 2]

Cara, eu testei aqui e não deu problema nenhum aparentemente. Mas acho que esta dúvida seria pertinente ao pessoal de Javascript

[Jorge Jardim 0]

Só complementanto que o primeiro problema naum ocorrre no FireFox mas ocorro no IE.

[Giovani 104]

Jorge,

 

Aqui no meu pc funcionou de maneira idêntica tanto no IE como no Firefox.

 

E a sua segunda dúvida realmente deve ser postada lá com o pessoal do javascript!

 

Abraços!! http://forum.imasters.com.br/public/style_emoticons/default/joia.gif