Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

漂亮的网页加载进度条 FOR 2.5/3.0/4.0

[复制链接]
九天 发表于 2005-11-26 09:46:48 | 显示全部楼层 |阅读模式
在PW上看到的~就顺手转过来了~不知道有没有发过?

演示:


在header.htm里
找:

  1. <head>
复制代码

在下面加上:

  1. <!---测试加载进度条---->
  2. <SCRIPT LANGUAGE="JavaScript">
  3. <!--
  4. //***********默认设置定义.*********************
  5. tPopWait=0;//停留tWait豪秒后显示提示。
  6. tPopShow=5000;//显示tShow豪秒后关闭提示
  7. showPopStep=20;
  8. popOpacity=99;

  9. //***************内部变量定义*****************
  10. sPop=null;
  11. curShow=null;
  12. tFadeOut=null;
  13. tFadeIn=null;
  14. tFadeWaiting=null;

  15. document.write("<style type='text/css'id='defaultPopStyle'>");
  16. document.write(".cPopText { font-family: <%=fontfamily%>; background-color: #ffffff; color:#ff0000;border: 1px #00ff00 solid; font-size: <%=fontsize%>; padding-right: 4px; padding-left: 4px; height: 20px; padding-top: 3px; padding-bottom: 1px; filter: Alpha(Opacity=0)}");
  17. document.write("</style>");
  18. document.write("<div id='dypopLayer' style='position:absolute;z-index:1000;' class='cPopText'></div>");
  19. function showPopupText(){
  20. var o=event.srcElement;
  21.   MouseX=event.x;
  22.   MouseY=event.y;
  23.   if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};
  24.   if(o.title!=null && o.title!=""){o.dypop=o.title;o.title=""};
  25.   if(o.dypop!=sPop) {
  26.           sPop=o.dypop;
  27.           clearTimeout(curShow);
  28.           clearTimeout(tFadeOut);
  29.           clearTimeout(tFadeIn);
  30.           clearTimeout(tFadeWaiting);     
  31.           if(sPop==null || sPop=="") {
  32.               dypopLayer.innerHTML="";
  33.               dypopLayer.style.filter="Alpha()";
  34.               dypopLayer.filters.Alpha.opacity=0;     
  35.               }
  36.           else {
  37.               if(o.dyclass!=null) popStyle=o.dyclass
  38.                   else popStyle="cPopText";
  39.               curShow=setTimeout("showIt()",tPopWait);
  40.           }
  41.   }
  42. }

  43. function showIt(){
  44.       dypopLayer.className=popStyle;
  45.       dypopLayer.innerHTML=sPop;
  46.       popWidth=dypopLayer.clientWidth;
  47.       popHeight=dypopLayer.clientHeight;
  48.       if(MouseX+12+popWidth>document.body.clientWidth) popLeftAdjust=-popWidth-24
  49.           else popLeftAdjust=0;
  50.       if(MouseY+12+popHeight>document.body.clientHeight) popTopAdjust=-popHeight-24
  51.           else popTopAdjust=0;
  52.       dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;
  53.       dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust;
  54.       dypopLayer.style.filter="Alpha(Opacity=0)";
  55.       fadeOut();
  56. }

  57. function fadeOut(){
  58.   if(dypopLayer.filters.Alpha.opacity<popOpacity) {
  59.       dypopLayer.filters.Alpha.opacity+=showPopStep;
  60.       tFadeOut=setTimeout("fadeOut()",1);
  61.       }
  62.       else {
  63.           dypopLayer.filters.Alpha.opacity=popOpacity;
  64.           tFadeWaiting=setTimeout("fadeIn()",tPopShow);
  65.           }
  66. }

  67. function fadeIn(){
  68.   if(dypopLayer.filters.Alpha.opacity>0) {
  69.       dypopLayer.filters.Alpha.opacity-=1;
  70.       tFadeIn=setTimeout("fadeIn()",1);
  71.       }
  72. }
  73. document.onmouseover=showPopupText;
  74. // -->
  75. </SCRIPT>
  76. <SCRIPT LANGUAGE="JavaScript">
  77. <!--
  78. function openwin(URL)
  79. { showModalDialog(URL,"","dialogWidth:10px;status:no;dialogHeight:10px;resizable:no");
  80. }
  81. function news(URL)
  82. { window.open(URL,"news","toolbar=no,location=no,directories=no,status=yes,menubar=yes,scrollbars=yes,resizable=yes,copyhistory=yes,width=600,height=430,left=0,top=0");
  83. }
  84. function art(URL1)
  85. { window.open(URL1,"art","toolbar=no,location=no,directories=no,status=yes,menubar=yes,scrollbars=yes,resizable=yes,copyhistory=yes,width=650,height=430,left=0,top=0");
  86. }
  87. function down(URL2)
  88. { window.open(URL2,"down","toolbar=no,location=no,directories=no,status=yes,menubar=yes,scrollbars=yes,resizable=yes,copyhistory=yes,width=500,height=400,left=0,top=0");
  89. }
  90. function photo(URL3)
  91. { window.open(URL3,"photo","toolbar=no,location=no,directories=no,status=yes,menubar=yes,scrollbars=yes,resizable=yes,copyhistory=yes,width=760,height=580,left=0,top=0");
  92. }
  93. function link()
  94. {win = window.open("","link","width=400,height=150")}
  95. function vote()
  96. {win = window.open("","vote","status=yes,scrollbars=yes,width=600,height=350")}
  97. // -->
  98. </SCRIPT>
  99. <div id="ld" style="position:absolute; left:0px; top:0px; width:100%; height:100%; background-color:#ffffFF; z-index:1000;">
  100. <br>
  101. <br><br><br><br><br><br><br><br><br><br><br>
  102. <table align="center" width="50%">
  103. <tr>
  104.   <td align="center"><font color=#0000ff><b>(忧湖小轩)</b> http://www.no-sky.com</font><br>
  105.     <br>
  106.     <font color="#0000ff"> 正在进入请稍等 … … </font></td>
  107. </tr>
  108. </table>
  109. <table width="50%" align="center" border="0" cellspacing="1" cellpadding="0" bgcolor="#ffffFF">
  110. <tr>
  111.   <td align="left" bgcolor="#ffffff" >
  112.   <table id="lpc" bgcolor="#3399ff" height="8">
  113. <tr>
  114. <td></td>
  115. </tr>
  116. </table>
  117. </td>
  118. </tr>
  119. <tr>
  120. <td></td>
  121. </tr>
  122. </table>
  123. </div>
  124. <div style="display:none;" id="page"><q id="q"></q></div>
  125. <script language="JavaScript">
  126. <!--
  127. ini = new Date().getTime();
  128. var pc = 0;
  129. load();

  130. function load()
  131. {
  132. pc += 4; lpc.style.width = pc + "%";
  133. time = setTimeout("load()",10);
  134. if (pc > 100)
  135. {
  136. clearTimeout(time);
  137. loaded()
  138. }
  139. }
  140. function loaded()
  141. {
  142. fim = new Date().getTime();
  143. dif = fim - ini;
  144. ld.style.display = 'none';
  145. //body.style.backgroundColor = 'white';
  146. //q.innerHTML = dif/1000;//显示加载时间到层q
  147. page.style.display = '';
  148. }
  149. function Show()
  150. {
  151. if (txt.style.display == "none")
  152. {
  153. txt.style.display ="inline"
  154. }
  155. else
  156. {
  157. txt.style.display = "none"
  158. }
  159. }
  160. -->
  161. </script>
  162. <!-----测试加载进度条----->
复制代码

其中里面的
<td align="center"><font color=#0000ff><b>(忧湖小轩)</b> http://www.no-sky.com</font><br>

改成自己的站的名字和网址
OK了

[ 本帖最后由 九天 于 2005-11-26 10:04 编辑 ]

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x

评分

1

查看全部评分

eghawk 发表于 2005-11-26 09:55:33 | 显示全部楼层
美化,不过还是不用了,但还是谢谢
回复

使用道具 举报

秋舞叶 发表于 2005-11-26 09:57:08 | 显示全部楼层
支持
回复

使用道具 举报

eghawk 发表于 2005-11-26 09:58:50 | 显示全部楼层
  <td align="center"><font color=#0000ff><b>(忧湖小轩)</b> http://www.no-sky.com</font><br>

注释一下最好
回复

使用道具 举报

 楼主| 九天 发表于 2005-11-26 10:02:46 | 显示全部楼层

回复 #4 eghawk 的帖子

没注意!偶去加上~
回复

使用道具 举报

2xy 发表于 2005-11-26 10:17:26 | 显示全部楼层
支持,但是又是Java的,太影响速度。
回复

使用道具 举报

jimmyjimmyqqq 发表于 2005-11-26 10:36:47 | 显示全部楼层
是影響速度的,沒要緊吧,支持支持支持!加分支持!
回复

使用道具 举报

 楼主| 九天 发表于 2005-11-26 11:30:07 | 显示全部楼层

回复 #7 jimmyjimmyqqq 的帖子

THX!
回复

使用道具 举报

hszl 发表于 2005-11-26 11:32:21 | 显示全部楼层
呵呵,我用了个文字的,不站点影不影响速度。。
回复

使用道具 举报

jinlun721 发表于 2005-11-26 11:50:00 | 显示全部楼层
装了 慢 …… 支持下
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2024-11-21 18:43 , Processed in 0.029604 second(s), 6 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表