J’utilise le code suivant pour repositionner mes menus déroulants s’ils sortent de la zone de la fenêtre du navigateur. Cependant, cela ne fonctionne pas dans Internet Explorer 7 et 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");} }); });
La propriété window.pageXOffset
n’est pas prise en charge dans IE (au moins 7 et 8). Essayez $(window).offset().left
place:
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");} }); });
Plus lisible, 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"); } }); });
J’utilise ce code:
var absoluteLeft = $(this).offset().left; var absoluteTop = $(this).offset().top; var absoluteRight = absoluteLeft + $(this).outerWidth(); var absoluteBottom = absoluteTop + $(this).outerHeight(); var viewportRight = $(window).width() + $(window).scrollLeft(); // scroll left will take into account the position of the horizontal scrollbar var viewportBottom = $(window).height() + $(window).scrollTop(); // scroll top will take into account the position of the vertical scrollbar if (absoluteRight > viewportRight) { // do whatever to handle horizontal bleeding } if (absoluteBottom > viewportBottom) { // do whatever to handle vertical bleeding }
N’a eu aucun problème dans IE. Le code suppose un positionnement absolu.