title: Endless scrolling on mobile device
body: <p>I'm having some trouble implementing endless scrolling for a list in my jQuery Mobile application. The code i am using now is this:</p>
  
  <pre><code>$(window).on('scrollstop', function () { 
    if ($(window).scrollTop() &gt;= $(document).height() - $(window).height() - 20) {
      if(scrollLoad &amp;&amp; currentPage &lt; totalPages)
      {
        $.mobile.showPageLoadingMsg();
        ShowMoreThings();
        scrollLoad = false; //Is set to true on ajax success in ShowMoreThings().
      }
    }
  });
  </code></pre>
  
  <p>This however does not cause the refresh to always trigger. The problem seems to be that the event triggers as soon as the user releases the screen, and the viewport keeps moving after this (due to the way scrolling usually works on mobile devices). The event will then calculate the position while it is still moving and not trigger the refresh since it has not reached the bottom. And then, with the viewport now at the bottom of the page, no further scroll events are triggered if the user tries to scroll further down as the viewport doesn't move. To trigger it, i need to scroll slightly up and then down again.</p>
  
  <p>I tried listening to scrollstart too, but it doesn't trigger attempting to scroll into "nonexistant space".</p>