Up next, we'll be messing with scroll events. Have you ever been annoyed when you visited a website that broke scrolling?

Imagine the damage if they were actually trying to be annoying!

Scroll down to continue.

Did you know? I can force the window to scroll wherever I want:

// You're scrolling down by 100px,
// whether you want to or not.
window.scrollBy(0, 100);

Of course, I don't want you scrolling for yourself. Let's keep you from scrolling at all.

html {
  overflow: hidden;
}

Even though you can't scroll, you can still *try* to scroll.

And I can watch you struggle:

window.addEventListener("mousewheel", e => {
  // nice try!
  struggles++;
});

Finally, we can take the scroll event and intentionally scroll the opposite way:

window.addEventListener("mousewheel", e => {
// go the *other* direction
window.scrollBy(0, -e.deltaY);
});

You made it!

Hope you learned a thing or two about how to (ab)use event listeners.