Problem mit onMouseOver mit IE
j0yr1de
- javascript
0 suit
Hallo Leute,
ich habe ein großes Problem. Ich habe eine Menustruktur die folgendermaßen aussieht:
<ul>
<li>Test</li>
<li>Test2</li>
<li>
<a href="bla.html" onMouseOver="document.getElementById('umnutzen').sytle.visibility='visible'; return false;" onMouseOut="document.getElementById('umnutzen').style.visibility='hidden'; return false;">
Nutzen
</a>
<div id="umnutzen" class="um">
<ul>
<li>Blub</li>
<li>Blab</li>
</ul>
</div>
</li>
</ul>
Mein CSS für die Klasse "um":
.um {
position: absolute;
top: 55px;
background-color: #666666;
width: 150px;
height: auto;
margin-left: 120px;
border: 1px solid red;
background-color:#black;
visibility: hidden;
}
Wie ihr seht ist mein Untermenu mit dem Attribut "hidden" erstmal versteckt, soll aber beim mouseover erscheinen. Im Firefox klappt alles Ohne irgendwelche probleme, im Internet Explorer funktioniert es leider nicht und ich weiß nicht weiter. Ich sitz schon die ganze nacht dran und komm einfach nicht drauf.
Ich würd mich freuen wenn mir jemand von euch Helfen kann, ich seh vor lauter Bäumen den Wald nicht mehr ...
MfG
j0yr1de
Ich würd mich freuen wenn mir jemand von euch Helfen kann, ich seh vor lauter Bäumen den Wald nicht mehr ...
Du solltest deine eventhandler auf das li-Element verschieben, da du das a-Element zwangsläufig verlässt, wenn du das Untermenü öffnest.
Weiters solltest du das div-Element entfernen und das ul-Element direkt als Kind des jeweiligen Menüpunkts aufführen (als Geschwister-Element zum Link).
Praktikabler ist es zudem mit der display-Eigenschaft zu arbeiten. (block/none).
Zudem: schreibe eine Funktion die prüft ob das aktuelle li-Element ein ul-Element als Kindelement beseitzt, wenn ja blende es entsprechend ein oder aus (etwa 15 Zeilen JavaScript) - du hast doch sicher mehrere Untermenüpunkte.
Alternativ kannst du dich auch mit einem JavaScript-Framework auseinandersetzen - jQuery und dessen hover()-Event könnte interessant sein.