This time I will share jQuery Plugin and tutorial about Smooth Scroll To Internal Anchors – jQuery scroll-to-anchor.js, hope it will help you in programming stack.
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.
How to use it:
1. Include the scroll-to-anchor.js
script after jQuery library. (jQuery 1.x is recommended for legacy browsers).
2 |
integrity = "sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" |
3 |
crossorigin = "anonymous" > |
5 |
< script src = "scroll-to-anchor.js" ></ script > |
2. Create an anchor link pointing to the target position you want to scroll to.
1 |
< a href = "#footer" id = "top" >Jump to Bottom</ a > |
4 |
< a href = "#top" >Back To Top</ a > |
3. Initialize the jQuery scroll-to-anchor.js plugin to enable the smooth scroll functionality on all the anchor links within the document.
1 |
$(document).scrollToAnchor(); |
4. Or call the function on a specified container.
1 |
$( 'nav' ).scrollToAnchor(); |
5. Customize the animation speed in milliseconds. Default: 3000(ms).
1 |
$( 'nav' ).scrollToAnchor({ |
6. Customize duration of the animation. Default: 200(ms).
1 |
$( 'nav' ).scrollToAnchor({ |
Changelog:
2019-03-15
This awesome jQuery plugin is developed by supermueller. For more Advanced Usages, please check the demo page or visit the official website.