Detecting unique scroll events in javascript

Question

$(window).scroll() lets you detect scroll events.

However, a single scroll triggers it many times.

How can I detect a literal scroll event; ie corresponding to a single swipe or mouse scroll?

Using a time threshold isn't ideal, because if you scroll hard enough, it can trigger up to a couple seconds' worth of scrolling.

You can't, all you can do is debounce it or count the scrolled amount — adeneo
– adeneo, Commented Jul 21, 2017 at 20:45
Watch the pointer events developer.mozilla.org/en-US/docs/Web/API/PointerEvent — Will
– Will, Commented Jul 21, 2017 at 20:52
The right keyword for your question is scroll delta, good luck. — Cleiton
– Cleiton, Commented Jul 21, 2017 at 23:38

mr.freeze · Accepted Answer · 2017-07-21 23:25:05Z

2

There aren't native events to detect when scrolling starts and stops, but you can achieve it through a plugin like this: https://github.com/ssorallen/jquery-scrollstop

It provides two events, scrollstart and scrollstop.

$(window)
  .on("scrollstart", function() {

  })
  .on("scrollstop", function() {

  });

It basically fires the scrollstart event after the first scroll then fires the scrollstop event after 250ms of no other scroll events. The time is adjustable.

answered Jul 21, 2017 at 23:25

mr.freeze

14.1k5 gold badges39 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Detecting unique scroll events in javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related