Hallo Zusammen,
um JQuery kennenzulernen versuche ich mich an einem Browser-FindTheDifferences mit JQuery/Css.
Folgenden Code habe ich dafür bereits geschrieben:
Problem: Beim click auf das Div (ID="test1") passiert im IE 8 nichts. Im FireFox klappt alles wie erwartet. Wenn ich dem Div einen Rahmen gebe sitzt es sowohl im IE als auch im Firefox an der selben stelle. Nur klicken bewirkt im FireFox halt nichts, wodurch toggleClass nicht greift.
Fällt euch im obigen code was auf? Oder klappt das mit dem z-index nicht so wie ich mir das wünschen würde?
Danke und Liebe Grüße!
um JQuery kennenzulernen versuche ich mich an einem Browser-FindTheDifferences mit JQuery/Css.
Folgenden Code habe ich dafür bereits geschrieben:
HTML:
<html>
<head>
<style type="text/css">
div.aussen { position:relative; z-index:0}
div.pic { position:relative; z-index:1; margin: 20px 20px 20px 20px; float:left;}
div.test { position:absolute; z-index:2; top:110px; left: 205px; height: 20px; width: 20px;}
div.click { position:absolute; z-index: 3; border:2px solid red;}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("div[id*=test]").click(function(event){
$(this).toggleClass("click");
});
});
</script>
</head>
<body>
<div class="aussen">
<div class="pic">
<img src="original.gif"/>
</div>
<div class="pic">
<img src="fake.gif"/>
<div class="test" id="test1"></div>
</div>
</div>
</body>
</html>Problem: Beim click auf das Div (ID="test1") passiert im IE 8 nichts. Im FireFox klappt alles wie erwartet. Wenn ich dem Div einen Rahmen gebe sitzt es sowohl im IE als auch im Firefox an der selben stelle. Nur klicken bewirkt im FireFox halt nichts, wodurch toggleClass nicht greift.
Fällt euch im obigen code was auf? Oder klappt das mit dem z-index nicht so wie ich mir das wünschen würde?
Danke und Liebe Grüße!
