Menu DHTML stile windows (ovvero orizzontale e sottomenu a cascata)

[Santino83_02]

Che ne dite di questo che ho fatto?

JAVASCRIPT:

var quanti = 3; // Imposta il numero di menu e di sottomenu
var i;
var timerID;

function apri(conta)
{
 clearInterval(timerID);

    var mostra = document.getElementById("sottomenu"+conta);
	var aperto;

    mostra.style.visibility = "visible"; // Visualizza i sottomenu

	 for (i=0; i<quanti; i++)
	 {
		 if (i != conta)
		 {
		   aperto=document.getElementById("sottomenu"+i);
		   aperto.style.visibility = "hidden";
		 }
	 }
}

function chiudiTimer()
{
timerID=setInterval('chiudi()',200);
}


function chiudi()
{
clearInterval(timerID);
for (i=0; i<quanti; i++)
  {
     document.getElementById("sottomenu"+i).style.visibility = "hidden";
  }
}

html:

<div style="margin-top:30px; position:relative;" >


	MENU #1 | 
	MENU #2 | 
	MENU #3
	
	
	
	<div onmouseover="clearInterval(timerID);" onmouseout="chiudiTimer();" id="sottomenu0" style="position:absolute; visibility:hidden; width:120px; background-color:#666666; color:#FFFFFF; left: 0px; top: 20px; ">
		<ul>
			[*]sotto1
			[*]sotto2
			[*]sotto3
		[/list]
  </div>
	 
	 <div onmouseover="clearInterval(timerID);" onmouseout="chiudiTimer();" id="sottomenu1" style="position:absolute; visibility:hidden; width:120px; background-color:#666666; color:#FFFFFF; left: 72px; top: 20px;">
		<ul>
			[*]sotto1
			[*]sotto2
			[*]sotto3
		[/list]
 	 </div>
	 
	 <div onmouseover="clearInterval(timerID);" onmouseout="chiudiTimer();" id="sottomenu2" style="position:absolute; visibility:hidden; width:120px; background-color:#666666; color:#FFFFFF; left: 149px; top: 20px;">
		<ul>
			[*]sotto1
			[*]sotto2
			[*]sotto3
		[/list]
  </div>
	
</div>

potrebbe andare come cosa o ci sono metodi migliori per farli?