Simple jquery progress bar plugin Lineprogressbar.js

Reference http://www.lanrenzhijia.com/jquery/4121.html

Demo download

<script src= "Js/jquery.lineprogressbar.js" type= "Text/javascript" ></script>     $ (function () {         $ ( ' #progressbar1 '). Lineprogressbar ({             percentage:50         });         $ (' #progressbar2 '). Lineprogressbar ({             percentage:25,             fillbackgroundcolor: ' #1abc9c '         });         $ (' #progressbar3 '). Lineprogressbar ({           percentage:61,           fillbackgroundcolor: ' #e67e22 ',           height: ' 35px '         });         $ (' #progressbar4 '). Lineprogressbar ({           percentage:78,           fillbackgroundcolor: ' #f1c40f ',           height: ' 65px ',           radius: ' 50px '         });     

　　

Introduce Jquery.lineProgressbar.css and jquery.lineProgressbar.js files in the page.

12	<linkrel="stylesheet" href="path/to/jquery.lineProgressbar.css"><scriptsrc="path/to/js/circleMagic.js"></script>

Use a <div> as a container for the progress bar.

1	<divid="progressbar1"></div>

After the page DOM element has finished loading, the jquery progress bar plug-in is initialized by the next Lineprogressbar () method.

1	$(‘#progressbar1‘).LineProgressbar();

The available configuration parameters for the Lineprogressbar.js progress bar plug-in are:

Parameters

Defines the width of the progress bar.

Type	Default value	Describe
Percentage	Int	Null	Defines the percentage of the progress bar.
Showprogresscount	Boolean	True	Defines whether a percentage value is displayed.
Duration	Int	1000	Defines the speed of the progress bar animation. The default is 1000 milliseconds. You can use the integer value Meng get keyword: slow or fast.
Fillbackgroundcolor	String	' #3498db '	Defines the background fill color of the progress bar.
BackgroundColor	String	' #EEEEEE '	Defines the background color of the progress bar.
Radius	String	' 0px '	Defines the fillet of the progress bar.
Height	String	' 10px '	Defines the height of the progress bar.
Width	String	' 100% '

Simple jquery progress bar plugin Lineprogressbar.js