ホームページ > 記事 > ウェブフロントエンド > jQueryを使ってページの先頭まで素早くスクロールする方法
jQueryを使ってページの先頭まで素早くスクロールする方法
- coldplay.xixiオリジナル
- 2020-12-17 14:53:143425ブラウズ
jQuery を使用してページの先頭まですばやくスクロールする方法: [scrollTo()] メソッドを使用して、ページの先頭まですばやくスクロールします。位置パラメータを 0 に設定すると、ページが先頭までスクロールします。構文は [$(window).scrollTop (position);] です。
このチュートリアルの動作環境: Windows7 システム、jquery3.2.1 バージョン この方法は、すべてのブランドのコンピューターに適しています。
jQuery を使用してページの先頭まですばやくスクロールする方法:
次のことができます。 jQuery()メソッドでscrollToを使用すると、ページの先頭まで素早くスクロールできます。 jQuery の scrollTo() メソッドは、選択した要素の垂直スクロール バーの位置を設定または返すために使用されます。 window プロパティにこのメソッドを適用することで、この動作を使用してページの先頭までスクロールできます。位置パラメータを 0 に設定するだけで、ページが先頭までスクロールします。
構文:
$(window).scrollTop(position);
例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
.scroll {
height: 1000px;
background-color: palegoldenrod;
}
</style>
</head>
<h2>使用jQuery快速滚动到页面顶部</h2>
<p>单击下面的按钮，滚动到页面顶部</p>
<p class="scroll">这里一段测试文本！这里一段测试文本！这里一段测试文本！</p>
<button onclick="scrollToTop()">单击，滚动到顶部</button>
<script src= "https://code.jquery.com/jquery-3.3.1.min.js"> </script>
<script>
function scrollToTop() {
$(window).scrollTop(0);
}
</script>
</body>
</html>ボタンをクリックする前のページ下部:
#JavaScript 学習チュートリアル ##
以上がjQueryを使ってページの先頭まで素早くスクロールする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：jQueryでトグルを使用する方法次の記事：jQueryでトグルを使用する方法