Basic Smooth Scroll In Vanilla JavaScript – SmoothScroll.js

Preview:

Description:

Yet another smooth scroll library in pure JavaScript that enables the internal anchor link to smoothly scroll to a specific point at a given speed.

Also provides 2 convenient methods that enable the user to scroll the window to the top and/or bottom of the webpage.

Heavily based on the requestAnimationFrame method.

How to use it:

Download and place the minified version of the SmoothScroll.js library at the bottom of the webpage.

<script src="smoothScroll.min.js"></script>

Enable the smooth scroll functionality on all the anchor links within the document.

document.querySelectorAll('a[href^="#"]').forEach(function (anchor) {
  anchor.addEventListener('click', function () {
    smoothScroll.scrollTo(this.getAttribute('href'), 1000);
  });
});

To scroll the page to the top or bottom:

smoothScroll.scrollTop(target);
smoothScroll.scrollBottom();