nicht angemeldet
Üblappendes DIV erhält im IE6 nicht die Ereignisse
Hallo,
ich habe ein kleines Problem mit sich überlappenden Elementen (siehe Beispiel unten). Im Bereich der Überlappung wird der Cursor im IE6 nicht als Move dargestellt. Im FF3 funktioniert es tadellos. Es geht hierbei nicht nur um den Cursor, sondern auch ein Mausklick wird im Bereich der Überlappung vom IE nicht für das div verarbeitet. Wenn die Position auf relative geändert wird, so dass es keine Überlappung gibt, reagieren beide Browser gleich und machen es richtig.
Das Problem ist nicht mit der einfachen Angabe der Z-Order zu lösen. Weiß jemand Rat, wie es auch mit der Überlappung funktioniert?
<html>
<body>
<img src="http://src.selfhtml.org/logo.gif" style="z-index:1" onclick="alert('img');"/>
<div style="z-index:2;position:absolute;cursor:move;top:0px;left:0px;width:80px;height:80px;border:1px solid red;" onclick="alert('div');"></div>
</body>
</html>
-
hi,
Das Problem ist nicht mit der einfachen Angabe der Z-Order zu lösen.
Doch, ist es. Lies dir nochmal den Artikel zu z-index durch und beachte, wann z-index erst nutzbar wird.
mfg
--
„Wenn du nicht bereit bist, dafür zu sterben, dann streiche das Wort »Freiheit« aus deinem Vokabular.“ -- Malcolm X
I Have a Dream-
Doch, ist es. Lies dir nochmal den Artikel zu z-index durch und beachte, wann z-index erst nutzbar wird.
Danke zunächst für die Antwort. Das Problem ist damit aber leider nicht gelöst. Ich hatte die Angabe z-index beim Image ergänzt, ohne die Angabe position ebenfalls zu ergänzen. Die Reihenfolge ist aber auch ganz ohne z-index bereits durch die Reihenfolge der Definition richtig. Das div liegt auf dem Image. Wenn ich nun in den überlappenden Bereich mit der Maus klicke, bekommt beim IE6 das img das Ereignis und beim FF3 das div. Letzteres halte ich für das richtige Verhalten (div liegt ja oben) und möchte ich in allen Browsern erreichen.
Man kann das Verhalten erreichen, wenn das div eine Hintergrundfarbe bekommt und die Transparenz auf 100% gestellt wird. In diesem Fall funktioniert es auch beim IE6. Das ist aber umständlich und um einen Rahmen zu haben benötigt man ein zweites div.
Gibt es einen anderen bzw. "richtigen" Weg?
<html> <head> <style type="text/css"> .bg { position:absolute; border:1px solid red; cursor:move; top:0px;left:0px; width:80px;height:80px; background-color:white; filter:alpha(opacity=0); /* IE */ } </style> </head> <body> <img src="http://src.selfhtml.org/logo.gif" onclick="alert('img');"/> <div class="bg" onclick="alert('div');"></div> </div> </body> </html>-
hi,
Gibt es einen anderen bzw. "richtigen" Weg?
Korrigiere mich wenn ich dich falsch verstanden haben sollte; funktioniert im IE 6 als auch in meinem FF 3 gleich.
Übrigens solltest du dich daran gewöhnen, zum testen Valides HTML zu schreiben; im Quirks-Mode taugt der IE noch weniger, als im Standard-Mode.
mfg
--
„Wenn du nicht bereit bist, dafür zu sterben, dann streiche das Wort »Freiheit« aus deinem Vokabular.“ -- Malcolm X
I Have a Dream-
Korrigiere mich wenn ich dich falsch verstanden haben sollte; funktioniert im IE 6 als auch in meinem FF 3 gleich.
Übrigens solltest du dich daran gewöhnen, zum testen Valides HTML zu schreiben; im Quirks-Mode taugt der IE noch weniger, als im Standard-Mode.
Ja, wenn das div eine Hintergrundfarbe hat, funktioniert es in beiden gleich. Auch wenn die Hintergrundfarbe transparent ist, funktioniert es. Nur wenn ich diese nicht angebe, klicke ich im IE6 quasi durch das div hindurch auf das img.
-
hi,
Ja, wenn das div eine Hintergrundfarbe hat, funktioniert es in beiden gleich. Auch wenn die Hintergrundfarbe transparent ist, funktioniert es. Nur wenn ich diese nicht angebe, klicke ich im IE6 quasi durch das div hindurch auf das img.
Ah, sorry. Ich hatte dich tatsächlich falsch verstanden.
Das scheint einer der vielen Bugs des IEs zu sein. Vielleicht doch mit einem zusätzlichen div um das erste div, du kannst ja auch das zusätzlich benötigte div in Conditional-Comments packen, um noch Sauberes Sinnvolles HTML zu erzeugen.mfg
--
„Wenn du nicht bereit bist, dafür zu sterben, dann streiche das Wort »Freiheit« aus deinem Vokabular.“ -- Malcolm X
I Have a Dream
-
-
-
-