R
ryanmhuc
This just seems to be in IE.
You have two layers (DIVs). One on top of the other using z-Index. Both
have a onMouseOver action and are positioned absolutely. If the bottom
layer does NOT have a border the top layer onMouseOver event fires
fine.
<div style=" position:relative; width:100px; height:100px;">
<DIV onMouseOver='alert("Top")' style='position:absolute; top:0px;
left:0px; width:100px; z-Index:2; height:100px;'></DIV>
<DIV onMouseOver='alert("Bottom")' style='position:absolute; top:0px;
left:0px; width:100px; z-Index:1; height:100px;'></DIV>
</div>
But if the bottom layer has a border. When moving over the bottom
layer's border the bottom layers onMouseOver event fires instead of the
top layer even though the top layer should. It works as expected in
FireFox but not IE. Anyone know how to get around this?
<div style=" position:relative; width:100px; height:100px;">
<DIV onMouseOver='alert("Top")' style='position:absolute; top:0px;
left:0px; width:100px; z-Index:2; height:100px;'></DIV>
<DIV onMouseOver='alert("Bottom")' style='position:absolute; top:0px;
left:0px; width:100px; z-Index:1; height:100px; border:6px
solid;'></DIV>
</div>
Thanks
You have two layers (DIVs). One on top of the other using z-Index. Both
have a onMouseOver action and are positioned absolutely. If the bottom
layer does NOT have a border the top layer onMouseOver event fires
fine.
<div style=" position:relative; width:100px; height:100px;">
<DIV onMouseOver='alert("Top")' style='position:absolute; top:0px;
left:0px; width:100px; z-Index:2; height:100px;'></DIV>
<DIV onMouseOver='alert("Bottom")' style='position:absolute; top:0px;
left:0px; width:100px; z-Index:1; height:100px;'></DIV>
</div>
But if the bottom layer has a border. When moving over the bottom
layer's border the bottom layers onMouseOver event fires instead of the
top layer even though the top layer should. It works as expected in
FireFox but not IE. Anyone know how to get around this?
<div style=" position:relative; width:100px; height:100px;">
<DIV onMouseOver='alert("Top")' style='position:absolute; top:0px;
left:0px; width:100px; z-Index:2; height:100px;'></DIV>
<DIV onMouseOver='alert("Bottom")' style='position:absolute; top:0px;
left:0px; width:100px; z-Index:1; height:100px; border:6px
solid;'></DIV>
</div>
Thanks