简体   繁体   中英

jQuery hover to set position left doesn't work in IE?

I'm having an issue making the follow code work in ANY version of IE. The div that should be showing up simply does not appear on hover at all...

$('.trigger').hover(function() {
    $(this).css({'height':'390px','width':'475px'});
    $(this).find('.preview_window').css('left', '0px');
},
function(){
    $(this).css({'height':'29px','width':'29px'});
    $(this).find('.preview_window').css('left', '-9999px');
}
);

It's GOT to be something really stupid... seeing as how it works on everything but IE across the board. Can anyone shed some light?

I think you must add the position attribute to that div :

preview_window {
    position: relative;
}

You may need to specifically define the position method like this:

$('.trigger').hover(function() {
    $(this).css({'height':'390px','width':'475px'});
    $(this).find('.preview_window').css({'position':'absolute','left':'0px'});
},
function(){
    $(this).css({'height':'29px','width':'29px'});
    $(this).find('.preview_window').css({'position':'absolute','left':'-9999px'});
});

Turns out IE just didn't like where I was putting line breaks in the function...

Here is the changed code that IE can apparently understand better.

$('.trigger').hover(function() {
    $(this).css({'height':'390px','width':'475px'});
    $(this).find('.preview_window').css('left', '0px');
},function(){ //This was also on two lines before
    $(this).css({'height':'29px','width':'29px'});
    $(this).find('.preview_window').css('left', '-9999px');
}); // This was on two lines before

I knew it was something stupid. Everything works now. =/

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM