Scroll To Anchor Plugin For jQuery

Just another smooth scroll jQuery plugin for animating scrolling to anchor links within the document. Behavior like the scroll-behavior CSS property.

See 10 Best Smooth Scroll JavaScript/jQuery Plugins for an overview of smooth scroll implementation.

How to use it:

1. Download the package and put the main script anchor.js after loading jQuery library.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/anchor.js"></script>

2. Create an anchor link on the page and specify the targer point using the data-anchor attribute as follows:

...
<button id="acceptTerms"> I have read and accept the Terms and Conditions</button>
...
<a data-anchor="#acceptTerms" class="anchor"> Scroll To Anchor </a>

3. Override the default data attribute:

$(function () {
  $('.anchor[data-anchor]').on("click", function(e) {
    e.preventDefault();
    let target = $(this).attr("data-anchor");     
    scrollToAnchor(target);
  })
});

4. Specify the duration of the animation. Default: 2000ms.

$(function () {
  $('.anchor[data-anchor]').on("click", function(e) {
    e.preventDefault();
    let target = $(this).attr("data-anchor");     
    scrollToAnchor(target, 3000);
  })
});

---

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