ホームページ  >  記事  >  ウェブフロントエンド  >  クロスブラウザーでの垂直スクロールの割合を決定するにはどうすればよいですか?

クロスブラウザーでの垂直スクロールの割合を決定するにはどうすればよいですか?

Barbara Streisand
Barbara Streisandオリジナル
2024-10-18 17:17:30738ブラウズ

How to Determine Vertical Scroll Percentage Cross-Browser?

垂直スクロール パーセンテージのブラウザ間での決定

ユーザーが移動した垂直スクロールバーのパーセンテージを決定することは、Web において重要なタスクです発達。この記事では、最新のブラウザでこのクロスブラウザ互換性を実現する方法を調査します。

「onscroll」イベントを使用し、documentElement.scrollTop または body.scrollTop にアクセスすると、スクロールバーの現在位置を取得できます。さらに、documentElement.scrollHeight または body.scrollHeight は、スクロール可能な領域の合計の高さを提供します。

これらの値を組み合わせることで、次のようにスクロール パーセンテージを計算できます:

<code class="javascript">var percent = (h[st] || b[st]) / ((h[sh] || b[sh]) - h.clientHeight) * 100;</code>

ここで:

  • h は documentElement オブジェクトです
  • b は body オブジェクトです
  • st は、scrollTop プロパティです
  • sh は、scrollHeight プロパティです

このメソッドは、垂直スクロールのパーセンテージを決定するための、正確でブラウザー間互換性のあるソリューションを提供します。 Chrome、Firefox、IE9 では正常に動作しますが、ブラウザ UI のスクロール時に自動非表示になるため、一部のモバイル ブラウザでは正確に 100% に達しない場合があります。

以上がクロスブラウザーでの垂直スクロールの割合を決定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。