Progress bar.js
With ProgressBar.js, it's easy to create responsive and stylish progress bars for the web. Animations perform well even on mobile devices. It provides a few built‑in shapes like Line, Circle and SemiCircle but you can also create custom shaped progress bars with any vector graphic editor.
ProgressBar.js is lightweight, MIT licensed and supports all major browsers including IE9+.
Usage
A simple code example of creating a Line shaped progress bar and animating it from 0% to 100%. See the install documentation for different installation options.
var ProgressBar = require('progressbar.js');
// Assuming we have an empty <div id="container"></div> in
// HTML
var bar = new ProgressBar.Line('#container', {easing: 'easeInOut'});
bar.animate(1); // Value from 0.0 to 1.0Examples
A few examples of using ProgressBar.js which can be quickly tested in JSFiddle. You can submit your own example suggestions to this issue.
Line
Basic line
Percent
Color animation
Basic line
Percent
Color animation
Circle
Basic circle
Bounce easing
Multiple properties
Basic circle
Bounce easing
Multiple properties
SemiCircle
Basic semicircle
Semicircle with text
Basic semicircle
Semicircle with text
Custom
Heart
