jQuery offset() メソッド

jQueryのHTML/CSSメソッド

offset()メソッドを使用して、選択された要素がドキュメントに対してのオフセット座標を取得または設定します。

offset()メソッドを使用するとき、取得オフセットを設定した場合、それを返します：最初の選択された要素のオフセット座標（含む2の属性オブジェクト（　top と left ））。

offset()メソッドを使用するとき、設定オフセットを設定した場合、それを設定します：すべての選択された要素のオフセット座標。

文法：

オフセット座標を取得します：

$("selector").offset()

オフセット座標を設定します：

$("selector").offset({top:value,　left:value})

関数を使用してオフセット座標を設定する：

$("selector").offset(function(index,　currentOffset))

インスタンス

段落のオフセット座標を取得します：

$("button").click(function(){
　　let　p　=　$("p");
　　let　offset　=　p.offset();
　　p.html("left:　"　+　offset.left　+　",　top:　"　+　offset.top);
});

すべての段落のオフセット座標を設定します：

$("button").click(function(){
　　$("p").offset({
　　　　top:　60,
　　　　left:　30
　　});
});

別の要素のオフセット座標を使用して要素のオフセット座標を設定します：

$("button").click(function(){
　　$("p").offset($("div").offset());
});

関数を使用してオフセット座標を設定する：

$("button").click(function(){
　　$("p").offset(function(i,　val){
　　　　let　newCord　=　new　Object();
　　　　newCord.left　=　val.left　+　100;
　　　　newCord.top　=　val.top　+　100;
　　　　return　newCord;
　　});
});

引数の値

jQueryのHTML/CSSメソッド