This time I will share jQuery Plugin and tutorial about Smooth Page Scrolling Plugin With jQuery – smoothPageScroll, hope it will help you in programming stack.
smoothPageScroll is a lightweight jQuery one page scroll plugin which enables the anchor links to scroll the webpage to desired points smoothly. Supports horizontal, vertical and diagonal scrolling effects. Easing effects are supported as well.
How to use it:
1. Put jQuery library and the jQuery smoothPageScroll plugin’s script in the footer of the webpage.
1 |
< script src = "//code.jquery.com/jquery-3.1.0.min.js" ></ script > |
2 |
< script src = "jquery.smoothPageScroll.js" ></ script > |
2. Include the jQuery easing plugin for additional easing effects.
1 |
< script src = "jquery.easing.1.3.min.js" ></ script > |
3. Create an anchor link pointing a specific container where you want to scroll to.
1 |
< a href = "#section" >Link</ a > |
4. Active the plugin with one JS call.
1 |
$( 'a[href^="#"]' ).smoothPageScroll(); |
5. Default config options.
01 |
$( 'a[href^="#"]' ).smoothPageScroll({ |
04 |
easing: 'easeOutQuart' , |
16 |
complate: function (){}, |
Change log:
2016-09-03
- fix target to currentTarget
This awesome jQuery plugin is developed by kamem. For more Advanced Usages, please check the demo page or visit the official website.