Can't delegate scroll event using jQuery

Question

I'm trying to use jQuery to fire an event on scroll on a particular class of elements, like so:

$('body').on('scroll', '.overflow', function() { do stuff; });

However, do stuff never happens. I've done a little experimentation, and it looks as though the scroll event can't be delegated using .on. (see http://jsbin.com/aJeDiru/2 for a test case).

Is there a way that I can get it to delegate? Or is there a Very Good Reason™ why it should never be set up to delegate in this fashion?

Well "scroll" is a weird event for bubbling, because it doesn't necessarily make sense for a parent element to get it if the child element scrolls independently. — Pointy
– Pointy, Commented Sep 4, 2013 at 21:18
stackoverflow.com/questions/10625104/… This should help (not the accepted answer though, the others). — gotohales
– gotohales, Commented Sep 4, 2013 at 21:29

Jason P · Accepted Answer · 2013-09-04 21:29:21Z

3

According to W3, the scroll event doesn't bubble.

Since event delegation relies on the event bubbling to the element you've attached the handler to, you won't be able to use delegation.

answered Sep 4, 2013 at 21:29

Jason P

27k3 gold badges34 silver badges45 bronze badges

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

Comments

Prokor · Accepted Answer · 2017-01-31 12:56:28Z

2

Use "mousewheel" instead,
make sure #contents is on the main html file.

    $("#contents").on('mousewheel',function(e) {
    if(e.originalEvent.wheelDelta /120 > 0) {
         //do something to the loaded elements
     } else {
        //do something to the loaded elements
     }
});

answered Jan 31, 2017 at 12:56

Prokor

215 bronze badges

Collectives™ on Stack Overflow

Can't delegate scroll event using jQuery

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related