ホームページ >ウェブフロントエンド >jsチュートリアル >jquery はブラウザ内の要素の位置をどのように取得しますか?

jquery はブラウザ内の要素の位置をどのように取得しますか?

云罗郡主
云罗郡主転載
2018-10-29 15:36:193102ブラウズ

jquery はブラウザ内の要素の位置をどのように取得しますか? jqueryに触れたばかりの友人の中には、このような疑問を持つ人も多いと思います。この章では、jquery がブラウザ内の要素の位置を取得する方法を紹介します。その方法は何ですか?困っている友人は参考にしていただければ幸いです。

1. オブジェクトを取得します (新しいウィンドウ参照要素を開くためのカスタム調整)

var obj = $(”#oButton”);

この例では、取得したオブジェクトはポップアップ ウィンドウ ボタンなので、新しいウィンドウが開きます。ボタンの位置に基づいて作成されます。インスタンス内に作成された新しいウィンドウの右下隅にボタンが表示されるように調整します。

2. オブジェクト要素の位置を取得します (offset() メソッド)

var offset = obj.offset();

オブジェクト要素の位置 (要素の上部と左端) を取得します。呼び出しメソッドは次のとおりです。 : offset.left と offset.top で、現在のオブジェクトの左と上の位置を知ることができます。

3. オブジェクト要素の幅を取得する(width()メソッド)

var right = offset.left+obj.width();

例では、オブジェクトの右下隅の位置と、オブジェクト要素の左端の位置を取得します。新しいウィンドウが作成されます。

4. オブジェクト要素の高さの取得(height()メソッド)

var down = offset.top+obj.height();

例では、オブジェクトの右下隅の位置と、オブジェクトの上部の位置を取得しています。新しいウィンドウが作成されます。

5. CSS スタイルを定義し、左と上をそれぞれ設定します。

‘left’:right,
‘top’:down,

CSS スタイルのマージンとパディングの値、およびブラウザ IE と Firefox の互換性に注意してください。

上記の例と組み合わせると、組み込みメソッド offset()、width()、height() を使用して、jQuery が要素の位置、高さ、幅を取得するのが非常に簡単になります。動的調整と新しいウィンドウを開く機能 他の拡張アプリケーションの場合も同様で、jQuery の要素の位置、高さ、幅を取得する方法を理解すると、新しい要素を作成したり、要素の位置とサイズを調整したりする場合に非常に実用的になります。

上記は、jquery がブラウザー内の要素の位置を取得する方法についての完全な紹介です。 JavaScript ビデオ チュートリアルについて詳しく知りたい場合は、どのような方法がありますか?, PHP 中国語 Web サイトにご注意ください。


以上がjquery はブラウザ内の要素の位置をどのように取得しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はlvyestudy.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。