jQueryで指定した可変(レスポンシブ)要素のposition / width / heightを取得する方法
2024/02/20
jQueryで指定した要素のposition(leftやtop) / width / heightを取得したかった。また指定する要素はレスポンシブ対応されていたので、ウィンドウ幅によって各値は変わってくる。とりあえず別要素クリック時に、指定要素の各値を取得する方法をメモ。
ソース
#html
<div id="check">調べたい要素</div>
<div id="answer"></div>
#jQuery
$(function(){
$('#check').click(function(){
var offset = $(this).offset();
var check = $(this);
var answer = '\
left:' + offset.left +
'<br>top:' + offset.top +
'<br>width:' + check.width() +
'<br>height' + check.height()
;
$('#answer').html(answer);
});
});
関連記事
-
-
セレクトメニューにサジェスト機能をつける方法(select2)
formのselectメニューで何文字が入力すると候補を絞って表示させるサジェス ...
-
-
jQuery UIを用いた日付及び時間のピッカーの利用方法
jQuery UIを用いた日付及び時間のピッカーを実装したい。以下にソースコード ...
-
-
FullCalendarでラベルごとに表示・非表示を切り替える方法
Googleカレンダーだとページ左側にマイカレンダーというのがあり、その中に任意 ...
-
-
「slick」でスライダー中央の下部にのみ指定したコンテンツを表示する方法
「slick」でスライダー画像の下部に何らかのコンテンツ(テキスト・リンク・別画 ...
-
-
javascriptやjQueryで画像を書き換えても変わらない場合
けっこう前に画像をアップロードしてリアルタイムにプレビューする機能を作った時に、 ...