Java-Scripts.net

Scroll to Top

Navigation made easy. Add a button that allows users to effortlessly glide back to the top of your content without manual scrolling.

Scroll down the page to see the button appear...

Copy the Script

<button onclick="goTop()" id="topBtn" style="display:none;">Top</button>

<script>
// Show button on scroll
window.onscroll = function() {
    if (document.documentElement.scrollTop > 100) {
        document.getElementById("topBtn").style.display = "block";
    } else {
        document.getElementById("topBtn").style.display = "none";
    }
};

// Scroll logic
function goTop() {
    window.scrollTo({ top: 0, behavior: 'smooth' });
}
</script>

Frequently Asked Questions

No. Modern JavaScript has `window.scrollTo({ behavior: 'smooth' })`, which is lightweight and native to browsers.

Yes. You can add a `window.onscroll` event listener to toggle the button's visibility (e.g., `display: block`) only after the user scrolls down 200 pixels.

In very old browsers (IE), 'smooth' behavior is ignored and it will jump instantly. This is a safe fallback.