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);
});
});
関連記事
-
-
jQueryでチェックボックスの全チェック&チェック解除する方法
フォームのチェックボックスで「全てにチェックを入れる」「全てのチェックを外す」と ...
-
-
formのtextareaに文字を入力した内容をリアルタイムプレビューする方法
textarea内に書いた内容をリアルタイムでプレビューする機能が必要になった。 ...
-
-
videoタグで表示させた動画をjQuery&CSSでフローティングビデオ対応させる方法
Web上の動画をFloatingVideo対応したいという要望を受けた。ページ上 ...
-
-
スクロールしてもついてくる追尾型の広告を作る方法
スマホサイトとかでよく見る、スクロールしてもページ下部とかに常時表示されている追 ...
-
-
jQueryでUNIXタイムスタンプの取得
jQueryでUNIXタイムスタンプを取得したい場合、 $.now()だけで取得 ...