Scroll To Anchor Plugin For jQuery
File Size: | 7.76 KB |
---|---|
Views Total: | 836 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

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.