jQuery Completion Bar

Posted on 07/06/2010 by David Turner

Quick example of how easy it can be to create and show a static progress bar using jQuery and some clever markup. This came about as a result of working on multiple projects and blog posts, and I was experimenting with way of showing the progress on my site.

In the end I never actually used it on my site, but I liked how quick and easy it was to piece together. Take a look through the HTML and CSS of the page to see how it all works.

Examples

Standard

Standard - Different Value

Variant - Colour