Home

Welcome to the progressBar wiki!

Usage

First of all include jquery plugin file and css at the top of the page:

<link rel="Stylesheet" media="screen" href="jquery.progress-bar.css"/>
<script type="text/javascript" src="jquery.progress-bar.js"></script>

Then you render progress bar into the container you like:

$('body div.stuff').progressBar({start: 1, total: 10});

This will render the progressbar into the div.stuff and will start from 1 of total 10 steps (10% progress).

Config options

Configuration options passed to .progressBar method as object. Possible properties are:

• start (int) - starting value of the progress bar
• total (int) - total steps. Current progress will be calculated as currentValue / total

##Working with API

To get api object, simply invoke .progressBar on already rendered widget:

$('body div.stuff').progressBar('api')

There you will have methods to manipulate progress bar or get information:

• value ([newValue:int]) - get or set current step of the progress bar
• total ([newTotal:int]) - get or set total steps of the progress bar

Example: To set total steps and current value of the progress bar do:

$('div.mybar').progressBar('api').value(10).total(33);