CSS Progress Bar BBCode

Ordinary BBCode Database
BBCodes that need nothing else than installation through ACP
There is no support here! Only Read Access!
User avatar
BBCode Bot
BBCoder IV
BBCoder IV
Posts: 239
Joined: 04 Mar 2010, 13:04
Location: bbcode table

CSS Progress Bar BBCode

Post by BBCode Bot » 06 Mar 2010, 09:16

CSS Progress Bar BBCode

Author: Stoker
Description: The CSS Progress Bar inserts a configurable progress bar in the topics.
Image

BBCode:

Code: Select all

[prog]{NUMBER}[/prog]
HTML:

Code: Select all

<div style="color: white; background-color: green; margin: 10px 0px 5px 0px; padding: 0px 10px 0px 10px; font-weight: bold; min-width:18px; max-width: 400px; width:{NUMBER}px; border: 1px solid black;">{NUMBER}%</div>
Helpline:

Code: Select all

Prog: [prog]Number between 1 and 100[/prog]
Example:

Code: Select all

[prog]15[/prog]

[prog]23[/prog]

[prog]46[/prog]

[prog]89[/prog]

[prog]100[/prog]
Demo:
[prog]15[/prog]

[prog]23[/prog]

[prog]46[/prog]

[prog]89[/prog]

[prog]100[/prog]

CSS Progress Bar 2

BBCode:

Code: Select all

[prog2]{NUMBER}[/prog2]
HTML:

Code: Select all

<div style="background-color: red; width:100px; border: 1px solid black;"><div style="background-color: green; color: white; font-weight:bold; max-width: 100px; width:{NUMBER}px;">&nbsp;&nbsp;&nbsp;{NUMBER}%</div></div>
Helpline:

Code: Select all

Prog2: [prog2]Number between 1 and 100[/prog2]
Example:

Code: Select all

[prog2]15[/prog2]

[prog2]23[/prog2]

[prog2]46[/prog2]

[prog2]89[/prog2]

[prog2]100[/prog2]
Demo:
[prog2]15[/prog2]

[prog2]23[/prog2]

[prog2]46[/prog2]

[prog2]89[/prog2]

[prog2]100[/prog2]