CODEWITHSUNDEEP
jqueryscroll
Pompey
Pompey

Reputation: 606

jquery detect user scrolling to bottom firing too early

I need to detect when a user has scrolled to the bottom of my page. So I searched around a bit and found a lot of help, all with basically the same answer, just maybe slightly varied. I've tried out basically all the different versions that I could find, but all of them exhibit the same behavior. Instead of waiting for me to scroll to the bottom of my page (actually have the scroll bar go all the way to the bottom), it fires when I scroll just a tiny bit. So my scroll bar will have moved only a cm or less, and the event fires.

The code I'm using right now is from here stackoverflow.com/questions/3898130/

There are two versions in the accepted answer there and the first one doesn't actually fire at all. 

$(window).scroll(function () {
    if($(window).scrollTop() + $(window).height() == $(document).height()) {         
        //do stuff
    }
})

However, if I change it to the second version (even setting the offset to 0) it fires, but it fires much too early. Before the user actually scrolled to the bottom. 

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
       //do stuff
   }
});

Now this isn't a huge issue, I think I can live with it, but it is really annoying. Does anybody have any idea what I might be doing wrong? I'm testing in Chrome, but the same behavior is exhibited in Firefox.

Thanks!

Upvotes: 0

Views: 434

Answers (1)

charlesmwray
charlesmwray

Reputation: 36

Make sure your html has the DOCTYPE set by making the first line:

<!DOCTYPE html>

Ref: Jquery $(window).height() function does not return actual window height

Upvotes: 1

Related Questions