how to move the screen without a click to the bottom of the page using JavaScript?

Question

I am trying to create a website using JavaScript. I need to programm it in such a way, that when you open the website, you directly get to the bottom of the page (without clicking anything). That means, the page moves itself automatically downwards. How can I get this done?

Possible duplicate of [Scroll Automatically to the Bottom of the Page](https://stackoverflow.com/questions/11715646/scroll-automatically-to-the-bottom-of-the-page) — jkp, May 28 '17 at 11:40

score 0 · Answer 1 · answered May 28 '17 at 11:39

0

Use window.scrollTo() function

window.scrollTo(0,document.body.scrollHeight);

answered May 28 '17 at 11:39

Dinesh undefined

5,490
2
19
40

score 0 · Answer 2 · answered May 28 '17 at 11:43

Here's a good answer: how to automatically scroll down a html page?

Including a live demo: http://jsfiddle.net/ThinkingStiff/DG8yR/

Script:

function top() {
    document.getElementById( 'top' ).scrollIntoView();    
};

function bottom() {
    document.getElementById( 'bottom' ).scrollIntoView();
    window.setTimeout( function () { top(); }, 2000 );
};

bottom();

Html:

<div id="top">top</div>
<div id="bottom">bottom</div>

CSS:

#top {
    border: 1px solid black;
    height: 3000px;
}

#bottom {
    border: 1px solid red;
}

Enjoy :)

John Yepthomi · Answer 3 · 2022-07-24T12:05:20.430

Call This function on a component or page that you want the particular behaviour. This function will scroll to the bottom of the page. There won't be any scrolling effect without the css for smooth scroll. I have shown how to specify the css for the scrolling effect below, incase you require the scroll behaviour.
```
function scrollToPageBottom() {
  window.scrollTo(0, document.body.scrollHeight);
}
```
If you require the scroll behaviour: Here, I'm specifying the scroll behaviour on the root itself. You can target specific containers as per your requirement
```
*{
   scroll-behavior: smooth;
 }
```

P.S: This question has many answers already posted but I am sharing this because no one talks about the css scroll behaviour which some users may require. This answer is specific to the question where the OP wants to scroll to the bottom of the page without any user action when a page or component is opened or rendered but also specifyiuing the CSS for scroll behaviour if a user requires it.

how to move the screen without a click to the bottom of the page using JavaScript?

3 Answers3