ホームページ ウェブフロントエンド jsチュートリアル js_javascript スキルで固定レイヤーを配置する方法

js_javascript スキルで固定レイヤーを配置する方法

May 16, 2016 pm 04:44 PM
固定層 位置

ターゲット レイヤーの座標をより柔軟に設定するには、いくつかの HTML オブジェクトの座標を取得する必要があります。ここでは document.body.scrollTop などの属性を使用できますが、これらの属性は標準の xhtml Web ページにあり、より簡単に言えば < を使用します。 ;! DOCTYPE...> タグから取得される値は 0 です。このタグを使用しない場合、xhtml の本体の座標を取得するにはどうすればよいでしょうか。もちろん方法はあります。 document.documentElement を使用して document.body を置き換えます。たとえば、次のように記述できます。

コードをコピーします コードは次のとおりです:

var top=document.documentElement.scrollTop ||document.body.scrollTop; js では

||上記の例は、 if 条件文で使用できるだけでなく、変数の代入にも使用できます。
Copy code コードは次のとおりです。

var top=document.documentElement.scrollTop ?document.documentElement.scrollTop : document.body.scrollTop;
このように書くと良い互換性が得られます。もう 1 つ注意すべき点は、document.documentElement.scrollTop の値が宣言されていない場合、代わりに 0 が表示されることです。



js_javascript スキルで固定レイヤーを配置する方法説明: 現在のページのスクロール バー座標の垂直座標位置を取得するには、
document.body の代わりに
document.documentElement.scrollTop を使用します。 .scrollTop ;
document.documentElement は HTML タグを取得し、
document.body は body タグを取得します。
標準の w3c では、 document.body.scrollTop は常に 0 であるため、 document.documentElement.scrollTop を使用する必要があります。代わりに、
ページに対する相対的なマウスの位置を指定したい場合、ほとんどの検索エンジンは
event.clientX document.body.scrollLeft、event.clientY を使用するように求めます。 document.body.scrollTop;
マウスが想像と異なる場合でも、それは驚くことではありません。IE5.5 では document.body.scrollX オブジェクトがサポートされなくなったため、
文;


コードをコピーします コードは次のとおりです:
if (document.body && document .body.scrollTop &&document.body.scrollLeft)
{
top=document.body.scrollTop;
left=document.body.scrollleft; .documentElement.scrollTop&& document.documentElement.scrollLeft)
{
top=document.documentElement.scrollTop;
left=document.documentElement.scrollLeft;以下にいくつかのパラメータの使用法を説明します。
Web ページの表示領域の幅: document.body.clientWidth;
Web ページの表示領域の高さ: document.body.clientHeight;
Web の表示領域の幅page: document.body.offsetWidth (エッジの幅を含む);
表示される Web ページの領域の高さ: document.body.offsetHeight (エッジの幅を含む);ページ本文: document.body.scrollWidth;
Web ページ本文の完全なテキストの高さ: document.body.scrollHeight;
Web ページが高くスクロールされます: document.body.scrollTop;スクロール中のページ: document.body.scrollLeft;
Web ページの本文の上部: windows.screenTop;
Web ページの本文の左側: windows.screenLeft; .screen.height;
画面の解像度の幅: windows.screen.widht;
使用可能なワークスペースの高さ: windows.screen.availHeight;
使用可能な画面の幅: windows.screen.availWidth;オブジェクトのスクロールの高さを取得します:scrollHeight;
オブジェクトの左端とウィンドウに現在表示されているコンテンツの左端の間の距離を設定または取得します:scrollLeft;オブジェクトの上部とウィンドウ内に表示されているコンテンツの上部:scrollTop;
オブジェクトのスクロール幅を取得します:scrollWidth; レイアウトを基準としたオブジェクトを取得するか、親座標で指定されたオブジェクトを取得します: offsetParent 属性親座標の高さ: offsetHeight;
レイアウトまたは offsetParent プロパティで指定された親座標を基準とした計算されたオブジェクトの左位置を取得します: offsetLeft;または offsetTop プロパティで指定された親座標 Position: offsetTop;
event.clientX: ドキュメントを基準とした水平座標;
event.offsetX: 水平座標コンテナに対する相対値;
event .offsetY: コンテナに対する相対的な垂直座標;
document.documentElement.scrollTop: スクロールの垂直方向の高さを設定します
event.clientX document.documentElement.scrollTop: 垂直方向のスクロール量文書の水平位置を基準としたもの。
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

uniappで地図と位置情報機能を使用する方法 uniappで地図と位置情報機能を使用する方法 Oct 16, 2023 am 08:01 AM

uniapp で地図および測位機能を使用する方法 1. 背景の紹介 モバイル アプリケーションの人気と測位技術の急速な発展により、地図および測位機能は現代のモバイル アプリケーションに不可欠な部分になりました。 uniapp は、Vue.js に基づいて開発されたクロスプラットフォーム アプリケーション開発フレームワークであり、開発者が複数のプラットフォームでコードを共有しやすくなります。この記事では、uniapp でのマップと位置決め関数の使用方法を紹介し、具体的なコード例を示します。 2. uniapp-amap コンポーネントを使用してマップ関数を実装します。

WordPress プラグインを使用してインスタント位置情報機能を実装する方法 WordPress プラグインを使用してインスタント位置情報機能を実装する方法 Sep 05, 2023 pm 04:51 PM

WordPress プラグインを使用してインスタント位置情報機能を実現する方法 モバイルデバイスの普及に伴い、ますます多くの Web サイトが位置情報ベースのサービスを提供し始めています。 WordPress Web サイトでは、プラグインを使用して即時測位機能を実装し、訪問者に地理的位置に関連するサービスを提供できます。 1. 適切なプラグインを選択する WordPress プラグイン ライブラリには、地理位置情報サービスを提供する多くのプラグインから選択できます。ニーズと要件に応じて、適切なプラグインを選択することが、即時測位機能を実現する鍵となります。ここにいくつかあります

Apple ワイヤレス イヤホンを紛失した場合の探し方_Apple ワイヤレス イヤホンの探し方 Apple ワイヤレス イヤホンを紛失した場合の探し方_Apple ワイヤレス イヤホンの探し方 Mar 23, 2024 am 08:21 AM

1. まず、携帯電話で[検索]アプリを開き、デバイスインターフェイスのリストからデバイスを選択します。 2. 次に、場所を確認し、ルートをクリックしてそこに移動します。

Go言語開発におけるメモリリーク箇所の問題を解決する方法 Go言語開発におけるメモリリーク箇所の問題を解決する方法 Jul 01, 2023 pm 12:33 PM

Go 言語開発におけるメモリ リークの場所の問題を解決する方法: メモリ リークは、プログラム開発における一般的な問題の 1 つです。 Go 言語の開発では、自動ガベージ コレクション機構の存在により、他の言語に比べてメモリ リークの問題が少ない可能性があります。ただし、大規模で複雑なアプリケーションに直面すると、依然としてメモリ リークが発生する可能性があります。この記事では、Go 言語開発におけるメモリ リークの問題を特定して解決するための一般的な方法をいくつか紹介します。まず、メモリ リークとは何かを理解する必要があります。簡単に言えば、メモリリークとは、

Amapで相手の携帯電話の位置を確認する方法 - Amapで相手の携帯電話の位置を確認する方法 Amapで相手の携帯電話の位置を確認する方法 - Amapで相手の携帯電話の位置を確認する方法 Apr 01, 2024 pm 02:11 PM

1. クリックして携帯電話の Amap 地図ソフトウェアに入ります。 2. 右下隅の「My」をクリックします。 3. をクリックしてファミリーマップを入力します。 4. 「マイファミリーマップの作成」をクリックします。 5. 作成が成功すると、招待コードが表示され、別の携帯電話と共有できます。

位置情報の変更方法と住所変更方法 位置情報の変更方法と住所変更方法 Mar 12, 2024 pm 09:52 PM

私たちは、Taku APP が非常に信頼できるチャットおよびソーシャル プラットフォームであることをはっきりと知っています。これにより、誰でもオンラインで友達を作ることができます。ここで友達を作るいくつかの形式では、主に場所によって友達を作ることができます。ああ、とてもシンプルで直接的です。結局のところ、あなたの現在の位置情報が自動的に特定され、同じ都市に住む互いに近い友人とのマッチングがより適切になるため、誰もがより簡単にチャットでき、特別な気分になれます。他の場所にいるもっと多くの友達と知り合うために、誰もが自分の住所を変更するという考えを持っていますが、位置情報を変更する方法が分からず、それは非常に困難です。具体的なものも集めました

Huawei スマートフォンを紛失した場合、その場所をすぐに見つけるにはどうすればよいですか? Huawei スマートフォンを紛失した場合、その場所をすぐに見つけるにはどうすればよいですか? Mar 24, 2024 am 08:48 AM

今日の社会において、携帯電話は私たちの生活に欠かせないものとなっています。有名なスマートフォンのブランドとして、ファーウェイの携帯電話はユーザーに深く愛されています。しかし、携帯電話の普及と使用頻度の増加に伴い、携帯電話を紛失することが多くなりました。携帯電話を紛失すると、私たちは不安や混乱を感じる傾向があります。では、残念ながら Huawei スマートフォンを紛失した場合、その場所をすぐに見つけるにはどうすればよいでしょうか?ステップ 1: 携帯電話の測位機能を使用する. ファーウェイの携帯電話には強力な測位機能が組み込まれており、ユーザーは携帯電話の設定で「セキュリティ」オプションを使用できます。

iPhone で「石油が見つかりました」と入力すると位置情報がトリガーされる?それでもプライバシーは保証できるのでしょうか? iPhone で「石油が見つかりました」と入力すると位置情報がトリガーされる?それでもプライバシーは保証できるのでしょうか? Apr 26, 2024 pm 01:28 PM

最近、インターネット上の多くのユーザーが、Apple の携帯電話を使用して「石油の発見」に関連するトピックについて検索したりコメントしたりすると、デバイスが自動的に測位をオンにして位置情報を収集および送信している疑いがあると述べていることがわかりました。ユーザーを監視するための情報。 iPhone で「石油が見つかりました」と入力すると位置情報がトリガーされますか? Apple のプライバシーはこの方法で保証できるのでしょうか?明らかに、これは誤解です! Appleカスタマーサービスによると、測位機能はデフォルトでオンになっており、特定のテキストの送信に限定されるのではなく、あらゆる操作がステータス更新をトリガーする可能性があるという。ただし、この記述は必ずしも包括的なものではありません。一般に、何かを検索している場合や、APP メカニズムの設定に関連する場合を除き、iPhone は位置情報機能を自動的に有効にします。背景。なぜこの話題ができるのか

See all articles