Basic jQuery Smooth Scrolling Plugin - smoothScroll
File Size: | 3.12 KB |
---|---|
Views Total: | 15018 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

smoothScroll is an ultra-lightweight jQuery plugin which provides smooth anchor scrolling experience to your long content web page.
How to use it:
1. Include the jQuery smoothScroll plugin after jQuery library in your web page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="js/smoothScroll.js"></script>
2. Include the jQuery UI for more easing options (Optional).
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.min.js"></script>
3. Create anchor links and targeted content as follows.
<a href="#content1">Content1</a> <a href="#content2">Content2</a> <a href="#content3">Content3</a> <h2 id="content1">Content1</h2> ... <h2 id="content2">Content2</h2> ... <h2 id="content3">Content3</h2> ...
4. Initialize the plugin with default settings.
$('a').smoothScroll();
4. Available options.
$('a').smoothScroll({ duration: 1000, // animation speed easing: 'swing', // find more easing options on http://api.jqueryui.com/easings/ offset: 0 // custom offset });
This awesome jQuery plugin is developed by jeanpan. For more Advanced Usages, please check the demo page or visit the official website.