Vertikale Navigation mit "mouseover"

[sf147]

Hallo,

folgendes Menü möchte ich umsetzen:

Menüpunkt 1
Menüpunkt 2
Menüpunkt 3
Menüpunkt 4

Wenn die Maus über einen Menüpunkt fährt soll ein Untermenü aufgehen ähnlich diesem:

Menüpunkt 1
Menüpunkt 2
    Untermenüpunkt 1
    Untermenüpunkt 2
    Untermenüpunkt 3
Menüpunkt 3
Menüpunkt 4

Unter den Untermenüpunkten wird es weitere Unteruntermenüpunkte geben, die ähnlich funktionieren sollen, aber das nur am Rande.
Verläßt die Maus nun den Bereich von Menüpunkt 2 oder der Untermenüpunkte 1...3 dann sollen die Untermenüpunkte verschwinden und sich ggfs. Untermenüpunkte der anderen Menüpunkte öffnen oder aber, falls z.B. die Maus nach links bewegt wird, nur noch die Menüpunkte zu sehen sein.
War das verständlich?

Der Ansatz meines Helferleins sah so aus:

	<script type="text/javascript">  
		function oeffneMP(mpid) {document.getElementById(mpid).style.display = "block";}  
		function schliesseMP(mpid) {document.getElementById(mpid).style.display = "none";}  
	</script>  

<div id="navcontainer" >
     <ul><li><a href="index.html" rel="self" id="current">Menuepunkt 1</a></li>
         <li><a onmouseover="oeffneMP ('untermenue');" onmouseout="schliesseMP ('untermenue');">Menuepunkt 2</a>
             <ul id="untermenue" style="display:none ;" >
                 <li><a href="verz1/index.html" rel="self">Untermenue 1</a></li>
                 <li><a href="verz2/index.html" rel="self">Untermenue 2</a></li>
                             ....... etc.

Das Problem ist nun, dass das Untermenü beim Mausziehen auf den Untermenüpunkt 2 zuklappt.

Ich habe nun wirklich extrem viel per Suchmaschine gesucht, gefunden und probiert, aber bisher half nix wirklich weiter.
Hat hier jemand einen Lösungsansatz?

herzlichen Dank
Carsten