Прокрутите вниз. Затем перезагрузите страницу и сделайте это снова

Question

Я использую этот простой код, и он работает нормально.

$("#mydiv").animate({ scrollTop: $('#mydiv')[0].scrollHeight}, 20000) 

То, что я хотел бы, чтобы после того, как дно было достигнуто немедленно вернуться к началу страницы и начать прокрутку вниз медленно снова. Как можно добиться чего-то подобного в JQuery?

Спасибо, ребята!

Answer 1

вы можете перейти обратно в верхней части страницы с помощью следующей яваскрипта функции:

function jump(elementId){ 
    var location = document.getElementById(elementId).offsetTop; 
    window.scrollTo(0, location);       
} 

просто использовать id некоторого элемента в верхней части страницы.

Answer 2

Не уверен, что вы пытаетесь сделать, и то, что «перезагрузка» означает, но вот быстрый отрывок, чтобы вы начали:

JSnippet Demo

Как вы можете видеть его настраиваемым и легко понять:

$(function() { 


    var pageScan = { 
     speed : 10000, 
     loop : true, 
     delayRestart : 1000, 
     start : function(){ 
      pageHeight = $('body').height() - window.innerHeight; 
      pageScan.proc(pageHeight); 
     }, 
     proc : function(to){ 
      $("body").animate(
       {scrollTop: to}, 
       pageScan.speed, 
       "linear", 
       function(){ 
        if (pageScan.loop) { 
         setTimeout(function() { 
          window.scrollTo(0, 0); 
          pageScan.start(); 
         }, pageScan.delayRestart); 
        } 
      }); 
     } 
    }; 

    pageScan.start(); 

    }); 

Answer 3

Мы могли бы сделать что-то проще, как это:

(function(){ 
    var div = $('#myDiv'), 
     infiniteScroll = function() { 

      //---gets the bottom of the page value 
      var bottomHeight = div[0].scrollHeight; 

      var callback1 = function() { 
       //once it gets into this callback function 
       //it resets the position to zero 

       div.scrollTop(0); 

       //invokes again the function infinite scroll 
       infiniteScroll(); 
      }; 

      div.animate({scrollTop:bottomHeight},20000,callback1) 
    }; 
    //starts the function for the very first time 
    infiniteScroll(); 

})(); 

Я создал codepen, так что вы можете видеть, что это работает и играть с ним:

http://codepen.io/dieggger/pen/VLoZWv?editors=101