ForMeter - Form completion progress bar

Plugin Description

ForMeter is a jQuery plugin that will allow you to add a fancy progress bar on your registration, contact, settings, CV, feedback or profile form, so the users will be able to see the percentage of form completion.


  • Flexible and super easy to add to existing websites
  • Fully customizable
  • Lightweight. The packed script weighs only 1.5kb
  • 6 styles included: spectrum(from red to green), red, gray, green, orange, blue
  • Prevents form submission if the user has not reached specified percentage
  • Works in all the major browsers including IE6
  • You can change the width and height of each progress bar
  • Generate beautiful progress bars for any form
  • Well documented
  • No external images required

Parameter list

  • speed : animation duration in milliseconds
  • style : this is the class or the ID that will stylize the progress bar
  • bubble : this option will enable/disable the percentage bubble under the progress bar. You can reposition and stylize the percentage bubble as you wish, by editing the formeter.1.2.css file
  • minPercent : Prevents form submission if the user has not reached specified percentage
  • message : Error message that will be displayed to the users, when the specified percentage has not been reached
  • selector : Determine the fields you want to recommend visitors to complete them, and give them a class required

Compatible Browsers

This plugin has been tested in all the following browsers :
  • Internet Explorer 6, 7, 8, 9 and 10
  • Firefox
  • Safari 5.1.2
  • Opera 10, 11 and 11.11
  • Chrome 11


1.2 (Dec 11 2013)
* The plugin has been completely rewritten
* Progress bar no longer freezes after several type/clear or check/uncheck cycles
* The bubble has been restyled
* The progress bar has been restyled
* Default selector changed

1.1 (Sep 10 2012)
* The percentage bubble has been restyled
* Was added a new feature that will allow you to prevent form submission if the user has not reached specified percentage
* Updated the documentation file
* Was added a new example that illustrates how to implement the Formeter plugin with multi-step forms

1.0 (Aug 9 2012)
* Initial version released 

Online demo and documentation

Follow me on Twitter, CodeCanyon or ThemeForest for the latest updates.