div, z-index und visibility ... IE-Bug?
Anton Katzer
- html
0 MudGuard
Hallo...
Folgende Situation:
... z-index des MouseOver-DIVs ist natürlich höher als das des eigentlich überlappenden DIVs.
Mein Problem ist, dass das überlappende DIV beim IE grundsätzlich ÜBER dem MouseOver-DIV liegt, ich bei letzterem also weder den optischen Effekt noch die Imagemap nutzen kann, unabhängig vom z-index.
Wenn ich den überlappenden DIV wegnehme, funktioniert's, es ist also kein Scriptfehler.
In FireFox und Opera funktioniert das ganze ebenfalls, nur halt im IE nicht. Es sind auch keine SELECT-Tags enthalten, der bekannte IE-Bug ist also ausgeschlossen ...
Was kann ich tun? Die einzige Alternative, die ich habe, ist das überlapp-DIV zu stückeln oder die Hintergrundgrafik zu ändern, aber das würde die Ladezeit ungünstig in die Höhe treiben ...
Hi,
- ein Hintergrundbild, auf dem Links optisch "erkenntlich" sind
- ein DIV-Layer, der ein auf "hidden" gesetztes <IMG> enthält.
- eine Funktion, die das Bild bei MouseOver auf "visible" setzt, also praktisch ein Rollover-Image
- eine Imagemap auf dem <IMG>
- ein weiteres DIV-Layer, das das "MouseOver-DIV" teilweise überlappt (Designtechnisch unvermeidlich)
... z-index des MouseOver-DIVs ist natürlich höher als das des eigentlich überlappenden DIVs.
Dank fehlendem Quellcode ist das natürlich nur geraten:
sind die div mit den z-index überhaupt positioniert?
cu,
Andreas
Sorry ... ja, die DIVs sind absolut positioniert.
Der Code ist noch ziemlich chaotisch, aber ich werde ihn mal post-bar zusammenklauben. ;)
Hier noch der entsprechende Quelltext:
<div id="Mindx" onMouseOver="SetVis('MindxGIF',1)" onMouseOut="SetVis('MindxGIF',0)" style="position:absolute; left:396px; top:433px; width:36px; height:37px; z-index:105">
<img style="visibility:hidden" src="img/main_Mindx.gif" width="36" height="37" border="0" usemap="#MMindx" id="MindxGIF">
<map name="MMindx">
<area shape="poly" coords="1,14,14,1,33,23,19,37" href="#" >
</map>
</div>
<div id="cbg" style="position:absolute; left:312px; top:0px; width:200px; height:600px; z-index:10">
<img src="img/nil_commentbg.jpg" width="200" height="600">
</div>
Und die SetVis-Funktion:
function SetVis(object_id,object_vis)
{
if (object_vis == 1)
document.getElementById(object_id).style.visibility='visible';
else
document.getElementById(object_id).style.visibility='hidden';
}
Wie gesagt, in FireFox und Opera funzt's.