ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript を使用して Web ページの先頭までスクロールするにはどうすればよいですか?

JavaScript を使用して Web ページの先頭までスクロールするにはどうすればよいですか?

Susan Sarandon
リリース: 2024-11-29 01:40:11
オリジナル
640 人が閲覧しました

How Can I Scroll to the Top of a Web Page Using JavaScript?

JavaScript を使用して Web ページの先頭にスクロールする

JavaScript を使用して Web ページの先頭に移動することは、特に一般的なタスクです。即時スクロールが必要な場合。これは、組み込みの window.scrollTo() メソッドを使用して簡単に実現できます。このメソッドを使用すると、ページ上の目的の位置を指定できます。

JavaScript コード:

ページの先頭まで即座にスクロールするには、次のコマンドを使用します。コード:

window.scrollTo(0, 0);
ログイン後にコピー

パラメータ:

  • xCoord: スクロール先の水平座標 (ピクセル単位)。左端までスクロールするには、これを 0 に設定します。
  • yCoord: スクロール先の垂直座標 (ピクセル単位)。上にスクロールするには、これを 0 に設定します。

xCoord と yCoord の両方に 0 を渡すと、ページの左上隅まで即座にスクロールできます。

使用例:

<!DOCTYPE html>
<html>
<body>
<p>Scroll down this page and then click the button.</p>

<button onclick="window.scrollTo(0, 0)">Scroll to Top</button>
</body>
</html>
ログイン後にコピー

ボタンをクリックすると瞬時にページがジャンプします

注: アニメーションを使用してスムーズなスクロールを実現したい場合は、JavaScript プラグインまたはフレームワークの使用を検討してください。

以上がJavaScript を使用して Web ページの先頭までスクロールするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート