Question

I’m using the following code to reposition my drop down menus if they fall outside of the browser window area. However it does not work in Internet Explorer 7 and 8.

jQuery(document).ready(function(){
    jQuery("#nav>ul>li").each(function() {
        pos = jQuery(this).offset();
        if(pos.left + 100 > jQuery(window).width()+window.pageXOffset-jQuery(this).width()) {
        jQuery(this).addClass("nav-shift");}
    });
});

Answer 1

The window.pageXOffset property is not supported in IE (7 and 8, at least). Try $(window).offset().left instead:

jQuery(document).ready(function(){
    jQuery("#nav>ul>li").each(function() {
        pos = jQuery(this).offset();
        if(pos.left + 100 > jQuery(window).width()+jQuery(window).offset().left-jQuery(this).width()) {
        jQuery(this).addClass("nav-shift");}
    });
});

More readable, IMO:

jQuery(document).ready(function() {
    jQuery("#nav > ul > li").each(function() {
        var $this = jQuery(this),
            $win = jQuery(window);

        if ($this.offset().left + 100 > $win.width() + $win.offset().left - $this.width()) {
            $this.addClass("nav-shift");
        }
    });
});