jQuery Plugin To Show Window Scroll In Percentage - progressIndicator
| File Size: | 6.44 KB |
|---|---|
| Views Total: | 1574 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
progressIndicator is a jQuery plugin that creates a customizable, animated top (or bottom) progress bar showing the current window scroll depth in percentage.
How to use it:
1. Include the jQuery progressIndicator plugin's script after you've included the latest jQuery JavaScript library.
<script src="//code.jquery.com/jquery-3.1.1.slim.min.js"></script> <script src="jquery-progress-indicator-1.0.5.js"></script>
2. Just initialize the plugin and done.
$.progressIndicator();
3. Customize the progress indicator.
$.progressIndicator({
direction : 'top', // or bottom
target : 'body', // selector
barColor: 'rgb(253, 191, 38)',
easingSpeed : 0.5,
height: 4,
});
4. Enable percentage display.
$.progressIndicator({
percentageEnabled : true,
percentageColor: '#222',
});
5. Callback functions.
$.progressIndicator({
onStart : function(){
// console.log("onStart");
},
onEnd : function(){
// console.log("onEnd");
},
onProgress : function(perecent){
// console.log(perecent);
}
});
Change log:
2017-07-18
- bugfixed
This awesome jQuery plugin is developed by tyleteam. For more Advanced Usages, please check the demo page or visit the official website.











