【关键字】：
【来 源】：http://blog.csdn.net/jiancong/archive/2006/11/10/1378309.aspx
网站进度条完美解决方案！
对网站的进度条感兴趣开始于使用360安全卫土时！由于这个软件的绿色进度条，我感觉这个软件很新奇、很神秘、技术含量很技高、细节性东西做得不错，用四个字来概括就是“焕然一新”。其实没使用这个软件之前，我觉得这东西并没不是那么的可靠，可能像3721上网助手一样，可以用来根治一下IE，但也遗留下很多垃圾。不过新的东西，我都爱去试试着它，即使遇上病毒之类的，大不多重装下系统或ghost下，使用这个软件之后，我对这个软件绝对是百分百好感的，还对那些叫我帮忙处理病毒或者计算垃圾的friend们大力推荐！除了它的“药到病除”的功效外，我很喜欢这个软件的进度条。
再一次让我对进度条感兴趣的是，精英招聘网的进度条，想不到网页也可以做出这么漂亮的进度条。
效果浏览：http://www.1010job.com/job/fslist.asp?functionid=3601
发现了新东西，如果让它在自己的眼线下消失，那就是自己罪过了！我不断的google\baidu，搜出来的东西都不是想要的，一度失望，叹气：漂亮的进度条，只会出自于高手里的高手。
今晚在网上逛了一下，无意中又让我发现了神奇的进度条！马上sase as这个网页的源文件，取了进度条关键的js代码，放在我的网站上运行，oh！！！功夫不负有心人，我的网站也有漂亮的进度条了，嘻，我也是高手了！
这东西让我仰慕一段时间了，今晚发现了，真的很开心，难免写了这些文字，发泄一下了！
===========================================================================
下面为进度条放在网页文件里的代码：
<BODY onload=loadBar(0)><SCRIPT language=javascript src="loadbar.js"></SCRIPT><DIV id=loader style="DISPLAY: none; Z-INDEX: 100; POSITION: absolute"><TABLE style="FILTER: Alpha(opacity=90)" onclick=loadBar(0) cellSpacing=1 cellPadding=5 bgColor=#bbbbb border=0> <TBODY> <TR> <TD align=left bgColor=#ffffff> <P><IMG style="MARGIN: 3px" alt=请等待 src="load.gif" align=left><STRONG>数据载入中...</STRONG></P></TD></TR></TBODY></TABLE></DIV><SCRIPT language=javascript type=text/javascript>loadBar(1);</SCRIPT>=========================================================
这个为用于显示进度条的图片，特别漂亮
=====================================================
进度条的js文件：loadbar.js
function loadBar(fl)//fl is show/hide flag
...{
var x,y; if (self.innerHeight)
...{// all except Explorer x = self.innerWidth; y = self.innerHeight;
} else if (document.documentElement && document.documentElement.clientHeight) ...{// Explorer 6 Strict Mode x = document.documentElement.clientWidth; y = document.documentElement.clientHeight; } else if (document.body) ...{// other Explorers x = document.body.clientWidth; y = document.body.clientHeight; } var el=document.getElementById('loader'); if(null!=el) ...{ var top = (y/2) - 50; var left = (x/2) - 150; if( left<=0 ) left = 10; el.style.visibility = (fl==1)?'visible':'hidden'; el.style.display = (fl==1)?'block':'none'; el.style.left = left + "px" el.style.top = top + "px"; el.style.zIndex = 2; }
}没有相关文章
|