Stop Javascript .scrollBottom function

Question

My .scrollBottom button works, but once it auto scrolls to the bottom I can't manually scroll back up because it is active and constantly scrolling down. What does it need for it scroll to absolute bottom and then STOP?

JavaScript

var timeOut;
  function scrollToBottom() {
    if (document.body.scrollBottom!=0 || document.documentElement.scrollBottom!=0){
    window.scrollBy(0,20);
    timeOut=setTimeout('scrollToBottom()',10);
    }
  else clearTimeout(timeOut);
}

HTML

<a href="#" onclick="scrollToBottom();return false">BUTTON</a>

http://stackoverflow.com/questions/270612/scroll-to-bottom-of-div might help with scrolling to the bottom. — Tim Čas, May 14 '13 at 18:41
Try `console.log(document.body.scrollBottom,document.documentElement.scrollBottom);` at the top of `scrollToBottom`. You will then see why your function always passes the conditional. [See this thread for your answer.](http://stackoverflow.com/questions/6148701/how-to-determine-if-vertical-scroll-bar-has-reached-the-bottom-of-the-web-page/13526491#13526491) — Matthew Blancarte, May 14 '13 at 18:45
Please don't pass strings to `setTimeout`! That uses `eval` (which is bad). Pass functions: `timeOut=setTimeout(scrollToBottom, 10);` or `timeOut=setTimeout(function(){ scrollToBottom() },10);` — gen_Eric, May 14 '13 at 20:00

score 0 · Answer 1 · answered Apr 09 '20 at 15:13

I found that by removing the timeOut=setTimeout('scrollToBottom()',10); the button scrolls down by 20 pixels on press. With that information - I changed the window.scrollBy(0,20); to a ridiculous number like: window.scrollBy(0,2000000); so I got this code:

var timeOut;
  function scrollToBottom() {
    document.body.scrollBottom!=0 || document.documentElement.scrollBottom!=0
    window.scrollBy(0,2000000);
}

And paired with

html {
  scroll-behavior: smooth;
}

It does the trick :)

Stop Javascript .scrollBottom function

1 Answers1