This time I will share jQuery Plugin and tutorial about Smooth ‘Back To Top’ Page Scroll Plugin With jQuery – scrolltop.js, hope it will help you in programming stack.
scrollbutton is a jQuery plugin that displays an auto shown/hide ‘back to top’ button when scrolling down to enhance the navigation experience on your long webpage. Works perfectly on responsive web design.
How to use it:
1. Include the required stylesheet jquery.scrolltop.css to style the ‘back to top’ button.
1 |
<link rel="stylesheet" href="jquery-scrollbutton.css"> |
2. Include jQuery library and the jquery.scrolltop.js at the bottom of the webpage.
1 |
<script src="//code.jquery.com/jquery.min.js"></script> |
2 |
<script src="jquery.scrolltop.js"></script> |
3. Initialize the plugin to generate a default ‘back to top’ button at the bottom of the webpage when you scroll down.
4. Change the default text/icon/symbol inside the ‘back to top’.
5. Specify the animation speed when scrolling back to the top of the webpage.
6. Add an extra CSS class to the ‘back to top’ button.
2 |
class: 'custom-scrolltop' |
This awesome jQuery plugin is developed by mattdanielbrown. For more Advanced Usages, please check the demo page or visit the official website.
