Tweet
I am hoping that someone can figure out why this simple javascript works fine in Firefox, but not in IE8. I appreciate any help. PS: I see it DOES work in IE9... but I can't use it if I cannot make it work in IE8 as well. Sincerely, Buffmin
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>
<script type="text/javascript" src="jquery-1.6.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
switches = $('#switches > li');
slides = $('#slides > div');
switches.each(function(idx) {
$(this).data('slide', slides.eq(idx));
}).hover(
function() {
switches.removeClass('active');
slides.removeClass('active');
$(this).addClass('active');
$(this).data('slide').addClass('active');
});
});
</script>
<style type="text/css">
#switches .active { font-weight: bold; }
#slides div { display: none; }
#slides div.active { display: block; }
</style>
</head>
<body>
<ul id="switches">
<li class="active">First slide</li>
<li>Second slide</li>
<li>Third slide</li>
<li>Fourth slide</li>
</ul> <div id="slides">
<div class="active">Well well.</div>
<div>Oh no!</div>
<div>You again?</div>
<div>I'm gone!</div> </div>
</body>
</html>
Comment