[推荐]精美的Loading进度条
2008-02-22 01:42:54来源:互联网 阅读 ()
<head>
<SCRIPT type=text/javascript>
<!--
var ie5 = (document.all&&document.getElementsByTagName);
var step = 0;
function setSB(v, el, inforEl, message) {
if (ie5 || document.readyState == "complete") {
filterEl = el.children[0];
valueEl = el.children[1];
if (filterEl.style.pixelWidth > 0) {
var filterBackup = filterEl.style.filter;
filterEl.style.filter = "";
filterEl.style.filter = filterBackup;
}
filterEl.style.width = v "%";
valueEl.innerText = v "%";
inforEl.innerText = message;
}
}
function setSBByStep(v, el, inforEl, message) {
if (ie5 || document.readyState == "complete") {
step = step v;
filterEl = el.children[0];
valueEl = el.children[1];
if (filterEl.style.pixelWidth > 0) {
var filterBackup = filterEl.style.filter;
filterEl.style.filter = "";
filterEl.style.filter = filterBackup;
}
filterEl.style.width = step "%";
valueEl.innerText = step "%"
inforEl.innerText = message;
}
}
window.onload = new Function("setSB(100,sb,infor,\'页面加载完毕\')")
function fakeProgress(v, el) {
if (v >= 100)
setSB(100, el, infor, "Loading Complete");
else {
setSB(v, el, infor, "Loading ...");
window.setTimeout("fakeProgress(" (v 1) ", document.all[\'" el.id "\'])", 100);
}
}
//-->
</SCRIPT>
<!-- #EndEditable -->
</head>
<body bgcolor="#FFFFFF" leftmargin="20" topmargin="20" onload="fakeProgress(0, sb)">
<!-- Status Bar Starts -->
<div id=sb
style="BORDER-RIGHT: white 2px inset; BORDER-TOP: white 2px inset; BACKGROUND: white; BORDER-LEFT: white 2px inset; WIDTH: 200px; BORDER-BOTTOM: white 2px inset; HEIGHT: 20px; TEXT-ALIGN: left">
<div id=sbChild1
style="FILTER: Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=0); WIDTH: 0%; POSITION: absolute; HEIGHT: 16px">
<div
style="FONT-SIZE: 1px; BACKGROUND: highlight; WIDTH: 100%; HEIGHT: 100%"></div>
</div>
<div
style="FONT-SIZE: 12px; WIDTH: 100%; COLOR: black; FONT-FAMILY: arial; POSITION: absolute; TEXT-ALIGN: center">0%</div>
</div>
<!-- Status Bar Ends -->
<div id=infor
style="FONT-SIZE: 12px; WIDTH: 100%; COLOR: black; FONT-FAMILY: arial; POSITION: relative; TEXT-ALIGN: center"></div>
<br>
<button onClick="fakeProgress(0, sb)">重新加载</button>
<!-- #EndEditable --></div>
</body>
</html>
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash