Endless scroll function with adding same page

Question

I would need an endless scroll function for a webpage. If the page gets scrolled to the bottom, the same page should be added without reloading the content.

Here would be a beginning of the code:

 $(window).scroll(function() {   
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
       alert("bottom!");
   }
});

I would be so thankful for your help!

score 0 · Accepted Answer · answered Nov 06 '19 at 09:16

You can just copy the contents of body and append it where your alert call is.

$(document).ready(function(){


  var contents = $("body").html();

  $(window).scroll(function() {   
     if($(window).scrollTop() + $(window).height() == $(document).height()) {
         $("body").append(contents);
     }
  });

})

JSFiddle

Worth pointing out, that I'd not leave this inside the body tags, but rather at the bottom of head, as duplicating the body element will result in the multiple instances of the script running.

Endless scroll function with adding same page

1 Answers1