一个简单的jquery进度条示例

　　用jQuery实现的最简单的进度条，只有不到10行代码。样式可以直接忽略。（有一个图片需要自己找一下）

一个简单的jquery进度条示例

　　[CSS]代码

复制代码代码如下:

　　$(function(){

　　var i=0;

　　(function progressBar(){

　　i=i+1;

　　if(i>=101){

　　i=0;

　　}

　　$("#proc").animate({width:i+"%"},500);

　　$("#progressWord").text(i+"%");

　　setTimeout(progressBar,1500);

　　})();

　　});

　　[CSS]代码

复制代码代码如下:

　　.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]代码

复制代码代码如下:

　　</div>

　　</div>