例子:进度条制作

<style type="text/css">
*{ margin:0px auto; padding:0px}
#wai{ 200px; height:10px; border:1px solid #60F;}
#nei{ 0px; height:10px; background-color:#F33; float:left}
</style>

<div style="600px; height:300px; margin-top:30px">

     <div id="wai">      

      <div id="nei">                 

      </div>    

    </div>

  <input type="button" value="开始" onclick="Start()" />

</div>

<script type="text/javascript">

function Start()

{  

  Bian();

  }

  var bfb = 0; function Bian()

  {    

  //将百分比变化

   bfb= bfb+1;    

  //改变宽度  

  document.getElementById("nei").style.width = bfb+"%";  

   //判断  

  if(bfb<100)

   {   

  window.setTimeout("Bian()",50);  

  }  

}

</script>

原文地址:https://www.cnblogs.com/l5580/p/5909249.html