制作进度条不用 java 语言,却是java培训的基础知识!
用到的技术:HTML + JavaScript;主要以javascript为主。
操作步骤:
1.首先制作一个html页面,代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8″>
<title>漂浮广告</title></head>
<body onload=”fakeProgress(0, sb)” topmargin=180 bgcolor=#CCCCCC>
<center>
<p style=”font-szie:9pt; line-height: 100%”>正在加载CodeFans.net,请稍侯……</p>
<span id=sb style=”width: 500px”>
<div style=”filter: Alpha(Opacity=0, FinishOpacity=60, style=1, StartX=0, StartY=0, FinishX=100, FinishY=0); width: 0%; height: 12px; position: absolute; background: #9999ff”></div>
<div style=”font-size: 12px; width: 100%; color: #ff3333; font-family: arial; text-align: center”></DIV>
</span>
</center>
</body> </html>
2.利用javascript实现进度条;代码如下
<script language=”javascript”>
function setSB(v, el ) {
var ie5 = (document.all && document. getElementsByTagName );
if (ie5 || document.readyState == ” complete “) {
filterEl = el.children[0];
valueEl = el.children[1];
filterEl.style.width = v + “%”;
valueEl.innerText = v + “%”;
}
}
function fakeProgress(v, el) {
if (v > 100)
location.href = “”;
else {
setSB(v, el);
window.setTimeout(“fakeProgress(” + (++v) + “, document.all[‘” + el.id + “‘])”, 20);
}
}
</script>
版权归属:康诺科技
2017/7/1