Scroll to the Top of the Page Using JavaScript

How to scroll to top of page with JavaScript/jQuery?

Wow, I'm 9 years late to this question. Here you go:

Add this code to your onload.

// This prevents the page from scrolling down to where it was previously.
if ('scrollRestoration' in history) {
    history.scrollRestoration = 'manual';
}
// This is needed if the user scrolls down during page load and you want to make sure the page is scrolled to the top once it's fully loaded. This has Cross-browser support.
window.scrollTo(0,0);

To run it on window load just put it wrap it like this (assumes you have JQuery referenced)

$(function() {
  // put the code here
});

history.scrollRestoration Browser support:

Chrome: supported (since 46)

Firefox: supported (since 46)

Edge: supported (since 79)

IE: not supported

Opera: supported (since 33)

Safari: supported

For IE if you want to re-scroll to the top AFTER it autoscrolls down then this worked for me:

var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
if(isIE11) {
    setTimeout(function(){ window.scrollTo(0, 0); }, 300);  // adjust time according to your page. The better solution would be to possibly tie into some event and trigger once the autoscrolling goes to the top.
} 

Scroll to the top of the page using JavaScript?

If you don't need the change to animate then you don't need to use any special plugins - I'd just use the native JavaScript window.scrollTo() method -- passing in 0, 0 will scroll the page to the top left instantly.

window.scrollTo(xCoord, yCoord);

Parameters

• xCoord is the pixel along the horizontal axis.
• yCoord is the pixel along the vertical axis.

Scroll to the top of the page using JavaScript?

If you don't need the change to animate then you don't need to use any special plugins - I'd just use the native JavaScript window.scrollTo() method -- passing in 0, 0 will scroll the page to the top left instantly.

window.scrollTo(xCoord, yCoord);

Parameters

• xCoord is the pixel along the horizontal axis.
• yCoord is the pixel along the vertical axis.

Smooth scroll to top of page

Use the onclick-Event:

<header id="top">....</header>
<div style="background-color: red; height: 1200px"></div>
<footer>
  <a style="cursor:pointer;" onclick="window.scrollTo({ top: 0, behavior: 'smooth' })"><img class="to-top" src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d6/Feather-arrows-arrow-up.svg/24px-Feather-arrows-arrow-up.svg.png"></a>
</footer>

How to jump to top of browser page

You can set the scrollTop, like this:

$('html,body').scrollTop(0);

Or if you want a little animation instead of a snap to the top:

$('html, body').animate({ scrollTop: 0 }, 'fast');

Vanilla JavaScript: Scroll to Top of Page

Have you tried waiting for page load before scrollTo? Try using window.onload

window.onload = function(){
    window.scrollTo(0,0);
}

Force page scroll position to top at page refresh in HTML

You can do it using the scrollTop method on DOM ready:

$(document).ready(function(){
    $(this).scrollTop(0);
});

---

Related Topics