✔ problem mit mouseover/out

Biergamasda

Biergamasda

Erfahrenes Mitglied
hi,

ich habe ein kleines Problem :)

Also

Code: 
 <div id="menue2" onmouseout="deakt(2);">
 	<div id="m1_ump1" class="umps">xxx</div>
 	<div id="m1_ump2" class="umps">xxx</div>
 	<div id="m1_ump3" class="umps">xxx</div>
 	<div id="m1_ump4" class="umps">xxx</div>

das sieht in etwa so aus, menue2 ist absolut positioniert, da es als "dropdown" dient. Jetzt stellt sich das Problem, dass ein mouseover über zB m1_ump1 bereits ein mouseout vom menue2 ist, deshalb wird das wieder deaktiviert, sprich invisible gesetzt.
Jetzt hätte ich die Frage, ob ich abfragen muss, ob mouseover eines umps ist, flag setzen und dann anhand dessen kontrollieren, ob ich menue2 wieder verschwinden lassen kann oder nicht. Ich hoffe da gibts eine elegantere/kürzere Methode :)

Und nein, ich möchte es nicht mit Listen machen :)

Vielen dank schon im Voraus,
MFG Masda
 
Hallo...

du siehst es richtig... beim onmouseover eines Kindknoten feuert vorher das onmouseout des Elternknoten.
Aaaber:-)....Events werden an Kindknoten vererbt.

Sprich: wenn du im Elternknoten Events überwachst, dann tust du dies gleichzeitig in dessen Kindknoten.

Was du nun machen kannst: Es ist recht einfach....
Es ist ja egal, ob onmouseover im Eltern-oder Kindknoten feuert, in beiden Fällen soll das Menu zu sehen sein. Die Lösung: der Aufruf der Funktion fürs mouseout muss zeitverzögert erfolgen.
Somit erfolgt der Aufruf der Funktion fürs mouseout erst nach dem(eigentlich späteren) fürs onmouseover.

In der Funktion selbst löschst du dann eingangs per clearTimeout() den gestarteten Timeout...somit wird die Funktion zum Verbergen nicht mehr aufgerufen, wenn ihr das mouseover eines Kindknotens folgte.

Hier nen kleines Beispiel zur Funktionsweise ;)
Code: 
<html>
<head>
<title>Test</title>
<script type="text/javascript">
<!--
var t;
function menu(o,e)
{
  clearTimeout(t);
  a = o.getElementsByTagName('div');
  d= (e) ? 'block' : 'none';
  for(i = 0; i < a.length; ++i)
    {
      a[i].style.display = d;
    }
}
//-->
</script>
<style type="text/css">
<!--
#menu2{width:100px;border:1px solid #000;background-color:#a1a1a1;}
#menu2 *{background-color:#c1c1c1;display:none;}
-->
</style>
</head>
<body>
<div id="menu2" onmouseout="t=setTimeout('menu(document.getElementById(\''+this.id+'\'),0)',100)" onmouseover="menu(this,1)">menu
 	<div>sub1</div>
 	<div>sub2</div>
 	<div>sub3</div>
 	<div>sub4</div>
</div>
</body>
</html>
 
danke, genau das hab ich gesucht :D

du könntest dir angewöhnen, etwas sprechendere Variablennamen zu verwenden, das grenzt ja schon fast an unseren "Ex" C++ Prof, der seine Funktionen entweder tuwas() oder u1() etc getauft hat :P


trotzem danke ^^

LG Masda
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück