GlobalEventHandlers.onscroll

onscroll は GlobalEventHandlers ミックスインのプロパティで、 scroll イベントを処理するイベントハンドラー (EventHandler) です。

scroll イベントは、ユーザー、 Web API、ユーザーエージェントの何れかによって文書のビューまたは要素がスクロールしたときに発生します。

target.onscroll = functionRef

functionRef

関数名または関数式です。この関数は引数として一つだけ、 UIEvent オブジェクトを受け取ります。

onscroll ハンドラーは同時に1つだけ割り当てることができます。

柔軟性を高めるために、 scroll イベントを EventTarget.addEventListener() メソッドに渡すことができます。

この例では <textarea> のスクロールを監視し、その結果である要素の垂直のスクロール位置をログ出力します。

<textarea>1 2 3 4 5 6 7 8 9</textarea>
<p id="log"></p>

textarea {
  width: 4rem;
  height: 8rem;
  font-size: 3rem;
}

const textarea = document.querySelector('textarea');
const log = document.getElementById('log');

textarea.onscroll = logScroll;

function logScroll(e) {
  log.textContent = `Scroll position: ${e.target.scrollTop}`;
}

• Document: scroll イベント
• Element: scroll イベント