[code="java"][/code]<html>
<head>
<title>js进度条的制作</title>
</head>
<body>
<div style="width:300px;border:1px solid #CCC;height:25px;overflow: hidden;">
<div id="progress_div" style="position: relative;left:0px;top:0px;height:25px;width:0px;background:blue"></div>
<div style="position: relative;left:0px;top:-25px;font-size:12px;color:red;width:300px;line-height:25px;height:25px;text-align:center">
正在加载中，进度 <span id="progress_span_count">0</span>/10...
</div>
</div>
</body>
</html>
<script>
var m=0;
function f_test(){
if(m<11){
if(m>0){
f_changeDiv(m);
}
progress_span_count.innerHTML=m;
setTimeout(function(){f_test()},1000);
m++;
}else{
m=1;
progress_div.style.width=0;
f_test();
}
}
var z=0;
function f_changeDiv(m){
if(z<30){
progress_div.style.width=parseInt(progress_div.style.width.replace("px",""))+1;
setTimeout(function(){f_changeDiv()},5);
z++;
}else{
z=0;
}
}
f_test();
</script>
<head>
<title>js进度条的制作</title>
</head>
<body>
<div style="width:300px;border:1px solid #CCC;height:25px;overflow: hidden;">
<div id="progress_div" style="position: relative;left:0px;top:0px;height:25px;width:0px;background:blue"></div>
<div style="position: relative;left:0px;top:-25px;font-size:12px;color:red;width:300px;line-height:25px;height:25px;text-align:center">
正在加载中，进度 <span id="progress_span_count">0</span>/10...
</div>
</div>
</body>
</html>
<script>
var m=0;
function f_test(){
if(m<11){
if(m>0){
f_changeDiv(m);
}
progress_span_count.innerHTML=m;
setTimeout(function(){f_test()},1000);
m++;
}else{
m=1;
progress_div.style.width=0;
f_test();
}
}
var z=0;
function f_changeDiv(m){
if(z<30){
progress_div.style.width=parseInt(progress_div.style.width.replace("px",""))+1;
setTimeout(function(){f_changeDiv()},5);
z++;
}else{
z=0;
}
}
f_test();
</script>
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
