Smooth Scroll To Internal Anchors - jQuery scroll-to-anchor.js

A small and configurable jQuery smooth scroll plugin that smoothly scrolls the page to internal anchors at a given speed.

Great for single page web app that makes it easier to navigate between page sections with a better scroll experience.

See also:

• 10 Best Smooth Scroll jQuery Plugins
• 10 Best Smooth Scroll JavaScript Plugins

How to use it:

1. Include the scroll-to-anchor.js script after jQuery library. (jQuery 1.x is recommended for legacy browsers).

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" 
        crossorigin="anonymous">
</script>
<script src="scroll-to-anchor.js"></script>

2. Create an anchor link pointing to the target position you want to scroll to.

<a href="#footer" id="top">Jump to Bottom</a>
  ...
<div id="footer">
  <a href="#top">Back To Top</a>
</section>

3. Initialize the jQuery scroll-to-anchor.js plugin to enable the smooth scroll functionality on all the anchor links within the document.

$(document).scrollToAnchor();

4. Or call the function on a specified container.

$('nav').scrollToAnchor();

5. Customize the animation speed in milliseconds. Default: 3000(ms).

$('nav').scrollToAnchor({
  speed: 2000
});

6. Customize duration of the animation. Default: 200(ms).

$('nav').scrollToAnchor({
  duration_min: 300
});

Changelog:

2019-03-15

• Bugfix

---

This awesome jQuery plugin is developed by supermueller. For more Advanced Usages, please check the demo page or visit the official website.