Bar indicator is a jquery based progress bar data display plug-in that can be used in a variety of scenarios such as data display, polling statistics, and task progress. It is easy to use, rich in options, almost to meet the user all based on the progress bar of the web design requirements, this article will be combined with examples to explain the use of bar indicator.
View Demo Download source code
Html
First load jquery and bar indicator related JS files and CSS files.
<link href= "Bi-style.css" rel= "stylesheet"/> <script src= "Jquery.min.js" ></script> < Script src= "Jquery-barindicator.js" ></script> <script src= "Jquery.easing.1.3.js" ></script >
With the animated buffering effect, remember to add the easing plugin, you can download the source package, these files are packed. Then add HTML to <body>:
See, the code in the number 55 is the progress bar to show the progress, the default is 100, of course, this number can also be defined in the plug-in call.
Jquery
Once you have the HTML ready, and then start calling bar indicator, just one sentence:
<script>
$ (' #bar '). Barindicator ();
</script>
is not very simple, of course, to meet your project needs, you need to make some settings, and bar indicator provides us with a wealth of option settings and event method calls, such as horizontal/vertical progress bar, progress bar color, numerical display, progress value acquisition and reset.
Options and methods
Bar indicator is very powerful and there are many options that are not listed in this article. The above introduction is about the jquery Bar indicator plug-ins to achieve progress bar display results, more content please continue to focus on this site.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
