A simple jquery progress bar example

The simplest progress bar implemented with jQuery has less than 10 lines of code. The style can be ignored directly. (Find an image by yourself)

[CSS] Code
Copy codeThe Code is as follows:
$ (Function (){
Var I = 0;
(Function progressBar (){
I = I + 1;
If (I> = 101 ){
I = 0;
}
$ ("# Proc"). animate ({width: I + "%"}, 500 );
$ ("# ProgressWord"). text (I + "% ");
SetTimeout (progress bar, 1500 );
})();
});

[CSS] Code
Copy codeThe Code is as follows:
. Progress_out {
Position: relative;
Border: 1px solid #3c4d60;
-Webkit-box-shadow: #666 0px 0px 3px;
-Moz-box-shadow: #666 0px 0px 3px;
Box-shadow: #666 0px 0px 3px;
Width: 200px;
Height: 40px;
}
. Progress_inner {
Background-color: # DADAE4;
Width: 100%;
Height: 40px;
}
. Progress_word {
Position: absolute;
Left: 50%;
Top: 24%;
Font-weight: bold;
}

[HTML] Code
Copy codeThe Code is as follows:
<Div id = "outDiv" class = "progress_out">
<Div id = "progressbar" class = "progress_inner">

</Div>
<Div id = "progressWord" class = "progress_word"> 0% </div>
</Div>