jquery - 如何获取隐藏对​​象的位置

Question

所以我有一个正在制作的megamenu，我想让它符合屏幕尺寸。当子菜单被下拉时，我不希望它离开屏幕边缘。我计划中的小问题是我不知道如何在元素对浏览器实际可见之前检测它的位置。有没有办法做到这一点？

Answer 1

元素在浏览器可见之前没有位置。

Answer 2

您可以将元素的不透明度设为 0.01，然后检查其位置。这使得普通用户可见但仍然不可见。

var offset = $(selector).show().css('opacity',0.01).offset();
$(selector).css('opacity',1).hide();

Answer 3

您可以显示元素以获取其位置并在之后隐藏它：

var element = $('#element');
element.show();
var position = element.position();
element.hide();

演示

Answer 4

var offset = $(selector).fadeTo(1, .01).offset();
$(selector).hide();

Answer 5

if($(this).offset().left - 90 < window.screenLeft) { 
    $(this).next().css('left','0')
}
else if($(this).offset().left + $(this).outerWidth() + 90 > window.innerWidth) {
    $(this).next().css('right', '0')
}
else { 
    $(this).next().css('left', '-90px')
}