GlobalEventHandlers.onscroll

ジャンプ先:
  1. 構文
  2. 例
  3. 注記
  4. 仕様書

HTML要素のスクロールイベントを処理します。

構文

element.onscroll = functionReference

パラメータ

functionReference はHTML要素がスクロールされた時に実行される関数を参照します。

例

<!DOCTYPE html>
<html lang="en">
  <head>
  <meta charset="UTF-8" />
  <style>
  #container {
    position: absolute;
    height: auto;
    top: 0;
    bottom: 0;
    width: auto;
    left: 0;
    right: 0;
    overflow: auto;
  }

  #foo {
    height:1000px;
    width:1000px;
    background-color: #777;
    display: block;
  }

  </style>
  </head>
  <body>
    <div id="container">
      <div id="foo"></div>
    </div>

    <script type="text/javascript">
      document.getElementById('container').onscroll = function() {
        console.log("スクロール中...");
      };
    </script>
  </body>
</html>

注記

スクロールイベントはユーザがHTML要素の内容をスクロールした時に発生します。Element.onscrollはelement.addEventListener("scroll" ... )と同じものを指します。

仕様書

HTML5 Event Listener . onscroll

ドキュメントのタグと貢献者

このページの貢献者: mdnwebdocs-bot, Kenju
最終更新者: mdnwebdocs-bot,