JavaScript

pageYOffsetでスクロールした距離を取得する【JavaScript】

この記事ではpageYOffsetを使って、スクロールした量を取得していきます。

pageYOffset

使い方

window.pageYOffsetという形式で使います。

サンプルコード

window.pageYOffsetを使って垂直方向のスクロール量を取得してみましょう。

$(window).scroll(function () {
  var y = window.pageYOffset;
  document.getElementById('output').innerHTML = y;
});
<div>垂直方向のスクロール量:<span id="output"></span></div>

デモ

上記コードを使ったデモが下記です。

垂直方向のスクロール量:


ウェブつくを支えてくれるスポンサー

  • この記事を書いた人
ウェブつく管理人

ウェブつく管理人

WEB制作の仕事をしています。より簡潔に、より分かりやすく解説していきたいと思い、サイトを運営しています。「読むのが苦にならないサイト」を目指しています。よろしくお願いします。

-JavaScript
-

© 2020 ウェブつく Powered by AFFINGER5