Smooth Scroll – Animate Scrolling to Anchor Links with JavaScript

Smooth Scroll is a lightweight script to animate scrolling to anchor links.

Getting Started

Compiled and production-ready code can be found in the dist directory. The src directory contains development code. Unit tests are located in the test directory.

1. Include Smooth Scroll on your site.

<script src="dist/js/smooth-scroll.js"></script>

2. Add the markup to your HTML.

Turn anchor links into Smooth Scroll links by adding the [data-scroll] data attribute. Give the anchor location an ID just like you normally would.

<a data-scroll href="#bazinga">Anchor Link</a>
...
<span id="bazinga">Bazinga!</span>

3. Initialize Smooth Scroll.

In the footer of your page, after the content, initialize Smooth Scroll. And that’s it, you’re done. Nice work!

<script>
    smoothScroll.init();
</script>

Shubham Kumar

Hey, I am Shubham and i love Blogging, Coding and exploring new things and obviously sharing my experience with you.

You may also like...