Progress bar

 

0%

Description

This template allows you to create a highly customizable progress bar anywhere in a wiki page. Just call it this way:

{{Progress bar
| param1 = value1
| param2 = value2
| etc.
}}

Calculation methods

There are two methods you can use to make your bar represent a progression. The first method is by simply specifying the progression parameter. You tell the percentage and the bar shows it. Simple. The second method can be used when you want to display a bar showing progression through a finite set of values. You give the min, max and current parameters, and the percentage is calculated with the following formula: ((current - min) / (max - min)) * 100. If both methods are used, the first one takes precedence. The examples below show how to use both methods.

How the text displayed on the bar and in the tooltip is determined

The tooltip and the bar are the two "zones" where text is displayed on the progression bar. Each one has its own "master parameter", title for the tooltip and progression-text for the bar. If you provide one of these parameters, you will see the text you entered in the corresponding area. If you skip one of these parameters (or both), the text which is displayed is determined automatically. It consists of the percentage represented by the bar (whether given directly through the first method or calculated through the second) , followed by the content of the desc parameter if specified. However, if you used the second calculation method, then you can force the text to show the content of the current parameter instead of the percentage, by adding the mode=value parameter to your template call. Note: to see the tooltip, just put your mouse over the bar. A little box containing the tooltip text should appear.

Notes

• Don't put the same value for the bar-background and the box-background parameters, or else you won't see the progression bar!
• If you want more information regarding authorized values for each parameter, please consult the CSS documentation on the W3C website.
• Unfortunately, the url css attribute is not supported by mediawiki, so you can't set bar-background=url(path/to/image)