All geek questions in one place

Autoscan at the bottom of the page, then the top and second

I created a toolbar that selects all the lines, but I need an automatic scroll that will slowly scroll down to the bottom of the page, and then slowly scroll back and repeat. I googled this and cannot get working code. I searched for jQuery codes, but something will do.

Since the page will adjust all the time when it does not have a fixed scroll height.

Not sure if you need more information, but if you do, I will update this question.

Relations Gambit

+4
source share
4 answers

You can use something like this.

//run instantly and then goes after (setTimeout interval) $("html, body").animate({ scrollTop: $(document).height() }, 4000); setTimeout(function() { $('html, body').animate({scrollTop:0}, 4000); },4000); var scrolltopbottom = setInterval(function(){ // 4000 - it will take 4 secound in total from the top of the page to the bottom $("html, body").animate({ scrollTop: $(document).height() }, 4000); setTimeout(function() { $('html, body').animate({scrollTop:0}, 4000); },4000); },8000); ​//Use this to stop the scroller -> clearInterval(scrolltopbottom);

Example: http://jsfiddle.net/NaP8D/11/

+8
source

This should work fine here, just change 5000 to time in ms to adjust speed.

http://jsfiddle.net/BDc6S/3/

 function scrollDown(el) { el.animate({ scrollTop: el[0].scrollHeight }, 5000, function() { scrollUp(el) }); }; function scrollUp(el) { el.animate({ scrollTop: 0 }, 5000, function() { scrollDown(el); }); }; scrollDown($("html,body"));​
+1
source

you should try this for a better result

 //run instantly and then goes after (setTimeout interval) $("html, body").animate({ scrollTop: $(document).height() }, 4000); setTimeout(function() { $('html, body').animate({scrollTop:0}, 4000); },4000); setInterval(function(){ // 4000 - it will take 4 secound in total from the top of the page to the bottom $("html, body").animate({ scrollTop: $(document).height() }, 4000); setTimeout(function() { $('html, body').animate({scrollTop:0}, 4000); },4000); },8000); $('html, body').mouseover(function(e) { $(this).stop(true); }).mouseout(function() { $(this).stop(false); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <div style="height:2000px; float:left; width:100%;"> Text text Text text Text text Text text Text text Text text Text text Text text Text textv Text text Text text Text text Text textText text Text textText text Text textText text Text textText text Text textText text Text textText text Text textText text Text textText text <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p>Text textText text <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> <p> Text textText text Text textText text Text textText text Text textText text Text textText text </p> </div>

http://jsfiddle.net/neelu/gvvnd0tt/8/

+1
source 
 function doSomething() { $(document).scrollTop($(document).height()); } setInterval(doSomething, 5000);

This will scroll to the bottom of the page every 5 seconds. This will be useful if you have custom scrollable downloadable content like facebook.

0
source

Source: https://habr.com/ru/post/1434844/

More articles:


All Articles