Jquery ProgressBar Demo

This is a demo of Jquery ProgressBar. It illustrates basic setings, api calls and events.

Download »

Options

Basic Example (Auto Start)
$('...').progressBarTimer({ autoStart: true });
Different colors (Auto Start)
$('...').progressBarTimer({ autoStart: true, baseStyle: 'bg-info', warningStyle: 'bg-warning', completeStyle: 'bg-danger' });
Striped (Auto Start)
$('...').progressBarTimer({ autoStart: true, striped: true });
Animated (Auto Start)
$('...').progressBarTimer({ autoStart: true, animated: true });
Set Height (Auto Start)
$('...').progressBarTimer({ autoStart: true, height: 30 });
Smooth (Auto Start)
$('...').progressBarTimer({ autoStart: true, smooth: true });
Time Limit & Warning Threshold (Auto Start)
$('...').progressBarTimer({ autoStart: true, timeLimit: 30, warningThreshold: 10 });
Labels (Auto Start, Percent)
$('...').progressBarTimer({ autoStart: true, label : { show: true, type: 'percent' } });
Labels (Auto Start, seconds)
$('...').progressBarTimer({ autoStart: true, label : { show: true, type: 'seconds' } });

Events

onFinish (Auto Start)
$('...').progressBarTimer({ autoStart: true, onFinish : function () { alert('That\'s all folks'); } });

API

$('...').progressBarTimer();