90

これはおそらく非常に単純な質問ですが、jQuery で要素の正しいオフセットを取得するにはどうすればよいでしょうか?

できます:

$("#whatever").offset().left;

そしてそれは有効です。

しかし、次のようです。

$("#whatever").offset().right 

未定義です。

では、jQuery でこれを実現するにはどうすればよいでしょうか。

ありがとう!!

4

8 に答える 8

165

アレックス、ゲイリー:

リクエストに応じて、回答として投稿された私のコメントは次のとおりです。

var rt = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

知らせてくれてありがとうございます。

次のように表現できる擬似コードの場合:

正しいオフセットは次のとおりです。

ウィンドウのマイナス
(要素の左オフセットと要素の外側の幅

于 2012-06-21T22:47:08.670 に答える
29
var $whatever        = $('#whatever');
var ending_right     = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

参照: .outerWidth()

于 2010-06-15T06:58:57.587 に答える
16

たぶん私はあなたの質問を誤解していますが、オフセットは水平と垂直の 2 つの変数を与えるはずです。これにより、要素の位置が定義されます。だからあなたが探しているのは:

$("#whatever").offset().left

$("#whatever").offset().top

要素の正しい境界がどこにあるかを知る必要がある場合は、次を使用する必要があります。

$("#whatever").offset().left + $("#whatever").outerWidth()
于 2010-06-15T06:59:21.007 に答える
9

グレッグが言ったことへの単なる追加:

$("#whatever").offset().left + $("#whatever").outerWidth()

このコードは、左側に対して正しい位置を取得します。意図が右側に対する相対的な右側の位置を取得することであった場合 (CSSrightプロパティを使用する場合など)、次のようにコードに追加する必要があります。

$("#parent_container").innerWidth() - ($("#whatever").offset().left + $("#whatever").outerWidth())

rightこのコードは、最初に CSSでプロパティを設定できない場合に、右側を固定アンカーとして設定する必要があるアニメーションで役立ちます。

于 2011-04-13T03:01:51.093 に答える
6

実際には、これらはウィンドウが左上の位置からまったくスクロールされていない場合にのみ機能します。
ウィンドウのスクロール値を差し引いて、要素を再配置してページに留まるのに役立つオフセットを取得する必要があります。

var offset = $('#whatever').offset();

offset.right = ($(window).width() + $(window).scrollLeft()) - (offset.left + $('#whatever').outerWidth(true));
offset.bottom = ($(window).height() + $(window).scrollTop()) - (offset.top + $('#whatever').outerHeight(true));
于 2012-07-18T20:24:10.127 に答える
5

Brendon Crawford はここで (コメントで) 最良の答えを持っていたので、彼がそうするまで答えに移動します (そして少し拡張するかもしれません)。

var offset = $('#whatever').offset();

offset.right = $(window).width() - (offset.left + $('#whatever').outerWidth(true));
offset.bottom = $(window).height() - (offset.top + $('#whatever').outerHeight(true));
于 2012-05-14T02:54:36.397 に答える