value_jquery を取得できない jQuery.position() メソッドの安全な代替メソッド

jQuery.position() メソッドを呼び出すと、親要素に対する相対的な位置が返されます。jQuery の公式ドキュメントでは、.offset() メソッドはドキュメントに対する相対的な位置を返すと説明しています。一方、 .position() は親要素を基準とした相対位置を返します。

しかし実際には、使用中に .position() によって返される値が 0 であることが多いことがわかりました。しかし、事実は0ではありません。特に Google Chrome や IE ブラウザでは顕著です。 Firefox ではこの問題は発生しません。

その理由は、Webkit ベースのブラウザー (Google Chrome および Safari ブラウザー) を例にとると、要素 (画像、フラッシュなど) が完全に読み込まれている場合にのみ、ブラウザーはこれらの要素の高さと幅にアクセスできるためです。 Firefox は、DOM がロードされた後にこれらのプロパティにアクセスできるため、要素のフル サイズを知る必要はありません。 Google Chromeではそうではありません。したがって、Google/IE などのブラウザでは、.position() を使用して要素のオフセットを取得する場合、取得される値は初期値 0 になることがよくあります。

解決策の 1 つは、$(document).ready イベントの後ではなく、$(window).load() イベントが発生した後に .position() 呼び出しを行うことです。しかし、この方法は信頼できない可能性があります。

もう 1 つの方法は、.offset() を使用して変換することです。

コードをコピー コードは次のとおりです:

jQuery.fn.aPosition = function() {
ThisLeft = this.offset().left;
ThisTop = this.offset().top;
ThisParent = this.parent();

parentLeft = thisParent.offset().left;
parentTop = thisParent.offset().top;

リターン {
left: thisLeft-parentLeft,
トップ: thisTop-parentTop
};
};

これにより冗長なコードが生成されますが、より信頼性が高く、安心して使用できます。