Conny: onMouseout bei Aufklappmenue

Einen schönen Sonntag Mittag wünsche ich euch.

Ich habe ein Hauptmenue in eine Tabelle gebettet. Bei Mouseover wird das jeweilige Untermenue auf visible gestellt und klappt damit unter der zugehörigen Überschrift auf.

Die Untermenues liegen jeweils auf einem <div> und sind passend positioniert. Nun soll das Untermenue natürlich wieder unsichtbar werden, sobald die Maus aus der Ebene heraus fährt. Ich habe dazu das onMouseOut an das <div> gebunden. Das funktioniert auch wunderbar - so lange reiner Text auf der Ebene steht. Wird der Text z. B. in <p> gebettet oder in Links verwandelt klappt das Menü zu, sobald man mit der Maus drüber fährt. Etwas unpraktisch, wenn man dort Links zur Auswahl stellen möchte...

Ok, im Netz findet man eine ganze Reihe an solchen Menüs, so dass man sich den Quellcode anschauen kann. Auf manchen Seiten gibt es ja auch extra Beispiele zum anschauen. Mein Problem mit denen ist aber, dass sie meistens sehr umfangreich sind, weil zum Beispiel zwischen 15 verschiedenen Browsern unterschiedenen wird oder hier und da noch kleine Extraeffekte eingebaut sind. Dazu kommen dann noch so Kleinigkeiten, dass natürlich die (optische) Darstellung eine andere ist oder Variablennamen anders benannt sind als im eigenen Beispiel. Letzteres alleine wäre bei einer einfachen Sache natürlich kein Problem, es zu übertragen, aber zusammen mit dem anderen Kram macht es den Quellcode für mich dermaßen unübersichtlich, dass ich einfach nicht voran komme. Meine Kenntnisse sind halt noch zu gering, als dass ich die einzelnen Angaben und Funktionen so ohne weiteres trennen könnte.

Ich habe nun auch schon mehrere eigene Ideen versucht umzusetzen, letztlich ist aber alles mehr ein Stochern im Heuhaufen ohne zu wissen, ob da überhaupt eine Nadel drin ist. Vielleicht ist mein Ansatz mit den Ebenen ja völlig falsch bzw. total umständlich. Oder das Arbeiten mit onMouseOut. Ich weiß es halt einfach nicht.

Deswegen wollte ich fragen, ob mir hier mal jemand eine Richtung geben kann, in die ich denken sollte, um eine Lösung zu finden. Nein, kein Privatunterricht, wirklich nur mal einen ersten Ansatz. Und auf ganz kleinem Niveau: ein Link, man fährt mit der Maus drüber, eine Ebene wird sichtbar, die Maus wird rausbewegt und die Ebene verschwindet wieder. Kein großartiges Design, keine Zeitverzögerung, keine sonstigen Effekte. Und es reicht auch, wenn es erst mal nur im Netzcape und/oder IE funktionierte.

Es wäre echt klasse, wenn mir jemand einen Tipp geben würde.

Grüße,
Conny

  1. Hi Conny,

    Deswegen wollte ich fragen, ob mir hier mal jemand eine Richtung geben kann, in die ich denken sollte, um eine Lösung zu finden. Nein, kein Privatunterricht, wirklich nur mal einen ersten Ansatz. Und auf ganz kleinem Niveau: ein Link, man fährt mit der Maus drüber, eine Ebene wird sichtbar, die Maus wird rausbewegt und die Ebene verschwindet wieder. Kein großartiges Design, keine Zeitverzögerung, keine sonstigen Effekte. Und es reicht auch, wenn es erst mal nur im Netzcape und/oder IE funktionierte.

    Es wäre echt klasse, wenn mir jemand einen Tipp geben würde.

    Lies Dir mal das Beispiel aus Selfhtml durch: http://selfhtml.teamone.de/dhtml/beispiele/navigation.htm.

    Viel Erfolg,

    MIK

    [...manche Surfer haben JavaScript deaktiviert...]

  2. Hi Conny,

    [...]

    Ich vermute mal, du scheiterst am Event-Bubbling:
    http://selfhtml.teamone.de/dhtml/modelle/microsoft.htm#event_bubbling
    Einen Weg, dies zu umgehen, kannst du dir aus dem Quelltext meiner oben verlinkten Seite rauslesen, achte auf timeout(ziemlich unten im Quelltext). ;-)

    Gruß

    Kurt

    --
    Nein, ich beantworte keine Anfragen per e-mail.
    ss:( zu:) ls:[ fo:) de:] va:| ch:| sh:( n4:° rl:( br:? js:| ie:% fl:( mo:?
    "Schweigen ist ein Argument, das kaum zu widerlegen ist."  (Heinrich Boell; dt. Schriftsteller u. Nobelpreistraeger; 1917-1985)
    http://elektro-dunzinger.at
    http://shop.elektro-dunzinger.at