Gerhard: Wieso reagiert IE 5.5 auf Events anders als IE 5

Hallo!
Hab mich gerade gefreut, dass mein Menü jetzt endlich im Opera, Mozilla und IE5 läuft und wollte es danach im IE5.5 testen.

Hier kann man das alles nachvollziehen:
Die Seite: http://www.gertschi.f2s.com
CSS: http://www.gertschi.f2s.com/menu.css
JavaScript: http://www.gertschi.f2s.com/menu.js

Ich habe in meinem Menü für jeden Menüpunkt 4 Ebenen (DIVs) eingebaut. Bei MouseOver bzw. Mouseout bzw. bei OnClick wird jedesmal eine andere Ebene sichtbar. Die 4 Ebene (mit dem höchsten Z-Index) liegt über all denen und fängt die Events ab (hatte ansonsten Probleme, da kein Event bei der Schrift ausgelöst wurde).
Warum so kompliziert, werden sich jetzt vielleicht einige fragen! Das war die einfachste Möglichkeit um für die 3 oben genannten Browser mit der _gleichen_ Seite den selben Effekt zu erzielen. Der Opera scheint nämlich das Verändern der Layer-Hintergrundfarbe nicht zu können :(

Zum Problem:
------------
Im IE5.5 (ohne SP) werden die Ereignisse (fast) richtig ausgelöst. Nur daucht hier das Problem mit der Schrift wieder auf! Wenn man mit der Maus über die Schrift fährt, wird ein Mouseout ausgelöst. Wirklich komisch, enthält doch der oberste Layer _keine_ Schrift.
Im IE5.5 mit SP1 hat man sich diesem Problem wohl angenommen (?), denn in diesem werden _gar keine_ Ereignisse mehr ausgelöst (so hat es jedenfalls den Anschein). Bei MouseOver, MouseOut bzw. OnClick tut sich einfach überhaupt nichts mehr.

Meine Vermutung:
----------------
Ich denke, dass es irgend etwas mit dem z-index der DIVs auf sich hat, nur hab ich keine Ahnung was und vorallem warum es im IE5.5 anders als im IE5 ist.

Ich hoffe, dass mir jemand mit einem Tipp bzw. einem Workaround behilflich sein kann.

MfG
Gerhard

  1. Moin,moin,

    ich habe den Quelltext nur kurz überflogen und mir sind 2 Dinge aufgefallen.

    1. ich habe div's gesehen in denen event's eingetragen sind aber kein Objekt mit Link. IMHO laufen solche Konstruktionen auf dem IE nicht.
    -- transparentes gif einsetzen.
    2. event's (click) und link
    -- kenne ich nur mit Problemen im IE. alles über die events mache und einen leer  "#" Link setzen.

    1. Hallo Guido!

      1. ich habe div's gesehen in denen event's eingetragen sind aber kein Objekt mit Link.

      Die DIV's haben auch keine Links. Das wird alles über JavaScript gemacht (im OnClick auf den DIV).

      IMHO laufen solche Konstruktionen auf dem IE nicht.

      Kann nicht ganz stimmen, denn auf dem IE5.01 lief es prima!

      -- transparentes gif einsetzen.

      Argh! Ich hasse gifs. Es muss doch ohne auch gehn.
      Mittlerweile hab ich die Fehlerquelle noch weiter eingeschränkt. Seit dem IE5.5 muss im DIV wohl ein Text stehen, damit die Events ausgelöst werden. Das wäre ja kein Problem, aber wie es scheint werden die Events dann aber auch nur ausgelöst wenn die Maus _genau_ über diesem Text ist und nicht sobald über dem DIV. :(
      Warum wurde das denn geändert, können sich die bei MS nicht einmal entscheiden und alle so lassen wie es ist?! In den anderen Browsern gelten die Ereignisse doch auch für den _ganzen_ DIV (auch ohne Text!).

      Kann mir da jemand helfen oder muss ich wirklich eine Menge   in die DIV's schreiben um die Events zu bekommen?

      1. event's (click) und link
        -- kenne ich nur mit Problemen im IE. alles über die events mache und einen leer  "#" Link setzen.

      Also das hat mir (bis jetzt) zum Glück noch keine Probleme bereitet. Deshalb werd ich es auch so belassen und hoffen, dass es noch ewig so bleibt.

      MfG
      Gerhard

  2. Hallo!
    Hab mich gerade gefreut, dass mein Menü jetzt endlich im Opera, Mozilla und IE5 läuft und wollte es danach im IE5.5 testen.

    Hier kann man das alles nachvollziehen:
    Die Seite: http://www.gertschi.f2s.com
    CSS: http://www.gertschi.f2s.com/menu.css
    JavaScript: http://www.gertschi.f2s.com/menu.js

    Ich habe in meinem Menü für jeden Menüpunkt 4 Ebenen (DIVs) eingebaut. Bei MouseOver bzw. Mouseout bzw. bei OnClick wird jedesmal eine andere Ebene sichtbar. Die 4 Ebene (mit dem höchsten Z-Index) liegt über all denen und fängt die Events ab (hatte ansonsten Probleme, da kein Event bei der Schrift ausgelöst wurde).
    Warum so kompliziert, werden sich jetzt vielleicht einige fragen! Das war die einfachste Möglichkeit um für die 3 oben genannten Browser mit der _gleichen_ Seite den selben Effekt zu erzielen. Der Opera scheint nämlich das Verändern der Layer-Hintergrundfarbe nicht zu können :(

    Zum Problem:

    Im IE5.5 (ohne SP) werden die Ereignisse (fast) richtig ausgelöst. Nur daucht hier das Problem mit der Schrift wieder auf! Wenn man mit der Maus über die Schrift fährt, wird ein Mouseout ausgelöst. Wirklich komisch, enthält doch der oberste Layer _keine_ Schrift.
    Im IE5.5 mit SP1 hat man sich diesem Problem wohl angenommen (?), denn in diesem werden _gar keine_ Ereignisse mehr ausgelöst (so hat es jedenfalls den Anschein). Bei MouseOver, MouseOut bzw. OnClick tut sich einfach überhaupt nichts mehr.

    Meine Vermutung:

    Ich denke, dass es irgend etwas mit dem z-index der DIVs auf sich hat, nur hab ich keine Ahnung was und vorallem warum es im IE5.5 anders als im IE5 ist.

    Ich hoffe, dass mir jemand mit einem Tipp bzw. einem Workaround behilflich sein kann.

    MfG
    Gerhard

    Wofür brauchst du für dieses Menü überhaupt soviele Layers.
    Definiere doch einfach eine Funktion die zuerst alle divs auf invisible setzt und dann das entsprechende auf sichtbar. Das ist die Methode, die ich verwende und komme dann immer mit 2 Layern aus.
    (dürte die Sache doch um einiges vereinfachen und gibt dann garantiert keine Probleme durch die Überblendung von Layern und deren Events)

    Raphael

    PS: Soll keine Kritik sein, sondern nur ein Vorschlag zur Vereinfachung ;)

    1. Wofür brauchst du für dieses Menü überhaupt soviele Layers.

      Ich benutzte 4 Layer pro Menüpunkt:

      1 Layer der den normalen Menüpunkt darstellt
      1 Layer der den Menüpunkt darstellt, der bei Mouseover angezeigt wird
      1 Layer der über diesen 2 Layern drüber liegt, da ich ansonsten immer Probleme mit dem Text im Layer hatte. Wenn man die Schrift unglücklich berührt und daraufhin den Layer verlässt, wird kein MouseOut ausgelöst (im IE5.5 und Mozilla 0.9.3 getestet, Opera scheint von diesem Problem unberührt zu sein). Und im IE5.0 hatte ich das Problem, dass beim Berühren der Schrift im Layer ein Mouseout ausgelöst wurde, da dieser die Schrift wohl nicht zum Layer zählt. Wenn du mir erklären könntest wie du dieses Problem umgangen hast bzw. mir eine Beispielseite zeigen kannst wäre ich zufrieden. Ansonsten kann ich mir nicht vorstellen, dass dein Menü reibungslos funktionieren kann.
      1 Layer für die Anzeige eines Fensters in dem steht, was den Benutzer auf den verlinkten Seiten erwartet

      Definiere doch einfach eine Funktion die zuerst alle divs auf invisible setzt und dann das entsprechende auf sichtbar.

      Diese Funktion brauch ich nicht, da ich das gleich ber CSS setzte, ansonsten habe ich es aber ähnlich gelöst.

      Das ist die Methode, die ich verwende und komme dann immer mit 2 Layern aus.

      Das kann ich nicht ganz glauben, dass das wirklich einwandrei funktioniert (siehe oben).

      (dürte die Sache doch um einiges vereinfachen und gibt dann garantiert keine Probleme durch die Überblendung von Layern und deren Events)

      Die Probleme sind damit weg, damit haust du recht, aber dafür sind andere da (siehe oben).

      PS: Soll keine Kritik sein, sondern nur ein Vorschlag zur Vereinfachung ;)

      Warum nicht? Konstruktive Kritik ist immer erwünscht.
      Ich hoffe, dich stört meine nicht.

      MfG
      Gerhard