jquery - 隠しオブジェクトの位置を取得する方法

Question

だから私は取り組んでいるメガメニューを持っていて、それを画面サイズに合わせたいと思っています。サブメニューがドロップダウンされたときに、画面の端からはみ出したくありません。私の計画の問題点は、実際にブラウザーに表示される前に、要素の位置を検出する方法がわからないことです。これを達成する方法はありますか？

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')
}