jquery offsetメソッド

TOPページに戻る > jquery入門

スポンサード リンク

jquery offset()メソッド

offsetメソッドは、可視状態にある指定したHTML要素の表示位置を取得するメソッドです
戻り値に2つの数値を持ちます
ページ左からの位置「offset.left」
ページ上かの位置「offset.top」
実際の使い方としては、offsetで要素の位置を取得し、cssメソッドで位置を変更するときに使います

幅の値を取得する

$("セレクタ").offset()

可視状態にある指定したHTML要素の表示位置を取得します

指定した要素をクリックしたときに、クリックした要素の表示位置を取得します
取得した位置(オブジェクト)を変数に入れて、HTMLに表示します

jquery

$(function() {
	$("#hoge").click(function(){
	var hoge = $(this).offset();
	$(this).html("この要素の位置はページ上からの値は"+ hoge.top +"<br>"+ 
	"この要素の位置はページ左からの値は"+ hoge.left);
	});
});
css
#hoge {
 cursor: pointer;
 border: solid 1px;
}

html

<div id="hoge"></div>

サンプル

この要素の表示位置は?






(C)2012 ホームページ作成無料