IE7 Javascript doesn’t fire inside a DIV

[deane034]

Hello people I’m having a frustrating problem with IE7. I have a small javascript that runs off on mouse enter a bunch of text. Basically it’s supposed to move the margin of a default hidden UL on hover. Following is a working example http://winyourtracks.com/learn_about_technologies.html

This works on all modern browsers including IE8, in IE7 however my mousenter event doesn’t seem to fire in the particular DIV it’s in. (The link above has IE7 display:block so it shows the text all the time)

Following is a test HTML code I’m using, if I paste myThing outside this div it works, but inside it doesn’t. I thought it was a z-index issue, however, that doesn’t seem to be the case.

any help would be much appreciated.

Here’s the HTML

Wierd

Iron Core






Produced from Superior steel alloy for a track 15% stronger than the competition's




 

And here’s the javascript

$(document).ready(function () {







$('#Mything').click(function() {

alert("YAAY");

});

$('.advantage-box h3').mouseenter(function() {



// first hide the rest

$('.advantage-box ul').animate({ opacity: 0 }, 0);

$('.advantage-box ul').hide();

$('.advantage-box ul').css("margin-top", '0px');



// now animate the selected one.

var theList = $(this).parent().find('ul');

theList.show();

theList.animate({ opacity: 0 }, 0);

theList.animate({ opacity: 1, marginTop: "25px" }, 'slow');







});



});

[deane034]

uuf. Turns out it is a z-index issue. Sorry about this.

[Author]

Posts