码迷,mamicode.com
首页 > 其他好文 > 详细

进度条的制作

时间:2016-09-23 16:55:03      阅读:103      评论:0      收藏:0      [点我收藏+]

标签:

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

<body>

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


<div id="wai">
<div id="nei">

</div>
</div>

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

</body>
<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>
</html>

进度条的制作

标签:

原文地址:http://www.cnblogs.com/sq45711478/p/5900469.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!