jquery endless scroll not functioning

Question

I am trying to implement an endless scroll functionality to my website and it is not working for some reason; This is the code I have

<script>
  $(document).ready(function () {
    alert("This part works");
    $(window).scroll(function () {
       if ($(window).scrollTop() == $(document).height()- $(window).height()) {
         alert("You have reached the bottom");
       }
    });
  });
</script>

The first alert box works and that lets me know that Jquery is working and the 2nd alert box is not working when i scroll to the bottom or at all any suggestions?

I just pasted your code to console and it's working on this page. Add console.log inside your scroll handler to see if it gets there. — artm, Nov 09 '14 at 06:21
I am using firefox, since this is on my website I am trying to make sure it works on all browsers — user1591668, Nov 09 '14 at 06:40

score 0 · Answer 1 · answered Nov 09 '14 at 06:48

0

Try this:

   $(window).scroll(function (e) {
       var elem = $(e.currentTarget);
           if (elem[0].scrollHeight - elem.scrollTop() <= elem.outerHeight()) 
           {
               alert('You have reached the bottom')
           }
    });

answered Nov 09 '14 at 06:48

mohammad falahat

757
1
4
11

Just tried it; it seems like firefox is not responding to it either. – user1591668 Nov 09 '14 at 07:34
@user1591668 here is answer for firefox problem: http://stackoverflow.com/questions/15932650/body-scrollheight-doesnt-work-in-firefox – mohammad falahat Nov 09 '14 at 07:39

jquery endless scroll not functioning

1 Answers1