✨scroll me

browser ⟩ event ⟩ type ⟩ scroll ⟩ example ⟩ scroll me

example of onscroll event handler.

replit ⟩ scroll me , require -> Node+ext, Element+boxes

const { log } = console

// ⭐️ import
import { $ } from './js/ext/Node_ext.js';     // Node + ext
import { } from './js/ext/Element+boxes.js';  // Element + boxes
// --------------------------------------------------------------------

// elements
const divScroll = $("#scroll-box");    // Node + ext
const output = $("#output");
const button = $("button");

// ⭐️ event handlers
// -------------------------------------------------------

// button.onclick
button.onclick = () => {
    log(divScroll.scrollBox.info);    // Element + boxes
    log(divScroll.paddingBox.info);
};

// divScroll.onscroll
divScroll.onscroll = () => {
    output.innerHTML = "🔥 Scroll event fired!";
    setTimeout(() => {
        output.innerHTML = "💤 Waiting on scroll events ...";
    }, 1000);
};
Previousscroll eventNextscroll progress

Last updated

Was this helpful?