title: Add JQuery spinner after scrolling to end of page
body: <p>I have the following code to append more contents into Div but unsure where to add the image loader so it shows at bottom of page before new contents are added.</p>
  
  <pre><code>$(window).scroll(function () {
      if ($(window).scrollTop() == $(document).height() - $(window).height()) {   
      $.getJSON("http://howtodeployit.com/?json=recentstories", function(data) {
      newposts = data.posts.slice(currentPostcount, currentPostcount + desiredPosts);
      $.each(newposts, function(key, val) {
          //Append new contents
          $("#postlist").listview().listview('refresh');
          });
      });
  }});
  </code></pre>
  
  <p>I have tried this but it requires AJAX:</p>
  
  <pre><code>beforeSend: function() { $('#loader').show(); },
  complete: function() { $('#loader').hide(); },
  </code></pre>