Continuous Looping Page (Not Infinite Scroll)

前端 未结 6 1392
忘掉有多难
忘掉有多难 2020-12-02 21:16

I\'m looking for resources that create scrolling functions like the ones found on these sites:
Outpost Journal
Unfold

Once the scroll bar hits the bottom

6条回答
  •  爱一瞬间的悲伤
    2020-12-02 22:04

    Forked from @clankill3r's answer, create two copy of body, prepend and append to the original body, then you can scroll the page in two direction endless.

    $('document').ready(function() {
    
        var origDocHeight = document.body.offsetHeight;
    
        var clone=$("body").contents().clone();
        clone.appendTo("body");
        clone.prependTo("body");
    
        $(document).scroll(function(){ 
    
            var scrollWindowPos = $(document).scrollTop(); 
    
            if(scrollWindowPos >= origDocHeight ) { 
                $(document).scrollTop(0); 
            }
            if(scrollWindowPos <= 0 ) { 
                 $(document).scrollTop(origDocHeight); 
             }        
        });
    });
    

提交回复
热议问题