jQuery 'scroll' not firing

Question

I have the following:

 var onScroll = function () {
        alert('scroll');
 };
 scrollArea = $('body');
 scrollArea.on('scroll', onScroll);

I can do $('body').scrollTop(400) and the body scrolls fine, but the alert is never called when I manually scroll. What could be causing this?

Yogesh Mistry · Accepted Answer · 2017-04-07 19:41:03Z

6

When you scroll the page, it's window that is scrolling not the body. So change it to $(window).on('scroll', onScroll);

EDIT: If you want to bind it to body specifically you may do it using document.body.onscroll = onScroll;. But make sure you do not bind any onscroll event to window in that case. If you do so, document.body.onscroll will be ignored and window.onscroll will be listened to.

Check this in action at the fiddle link here.

edited Apr 7, 2017 at 19:41

answered Apr 7, 2017 at 19:11

Yogesh Mistry

2,17217 silver badges20 bronze badges

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

Comments

Lupinity Labs · Accepted Answer · 2017-04-07 19:19:49Z

5

Don't use $('body'), but either $(document) or $(window) to catch the scroll, like this:

$(document).ready(function() {
    $(document).scroll(function() {
    console.log('Scrolled to ' + $(this).scrollTop());
  })
});

Here's a working jsFiddle: https://jsfiddle.net/4rrm3myL/1/

answered Apr 7, 2017 at 19:19

Lupinity Labs

2,5041 gold badge20 silver badges28 bronze badges

Collectives™ on Stack Overflow

jQuery 'scroll' not firing

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related