Kann Internet Explorer Ereignisse an absolut positionierte Elemente binden?
Ich kann einen "Klick" nicht an ein Element binden, das ein anderes überlappt.
Ich habe viele verschiedene Möglichkeiten ausprobiert, hier ein paar Tests, die im IE nicht funktionieren:
//version 1:
$(".classHolder").click(function(){ alert( $(this).html() ); });
//version 2:
$(".classHolder").each(function(){ $(this).click(function(){ alert( $(this).html() ); }); });
//version 3:
$("#id3").click(function(){ alert( $(this).html() ); });
//version 4:
$("#id3").click(function(){ alert( $(this).html() ); });
$("#id3").trigger("click");
// in all trials I tested with and without:
// $("img").unbind();
// $("div").unbind();
// just to make sure no "ghost" events were bind into the elements but no success.
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="application/javascript">
$(document).ready(function(){
$("#id3").click(function(){ alert( $(this).html() ); });
$("#id3").trigger("click");
});
</script>
</head>
<body>
<div id="id1" style="position:relative;">
<img id="id2" src="http://www.google.co.uk/intl/en_com/images/srpr/logo1w.png" style=";z-index:-1;"/>
<div id="id3" class="classHolder" style="position:absolute;border:2px solid red;left:0px;top:0px;width:70px;height:70px;z-index:1002;">G</div>
<div id="id4" class="classHolder" style="position:absolute;border:2px solid red;left:210px;top:0px;width:25px;height:70px;z-index:1001;">L</div>
asd asdf asdfg
</div>
</body>
</html>
