一种比较酷的页面载入特效代码_Web开发_学习笔记★闵涛★计算机学习电脑编程软硬件技巧


	转至繁体中文版	\| 网站首页 \| 图文教程 \| 资源下载 \| 站长博客 \| 图片素材 \| 武汉seo \| 武汉网站优化 \|

一种比较酷的页面载入特效代码

作者：闵涛文章来源：闵涛的学习笔记点击数：856 更新时间：2009/4/23 11:27:00

　　在<head></head>区域中加入以下代码
<script src="js/loadbar.js" type="text/javascript"></script>

　　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;
}
}

　　在<body></body>区域中加入以下代码
<body onMouseOver="window.status='喜欢本站,别忘了与朋友分享哦！';return true" onload="loadBar(0)">
<div id="loader">
<table class="loader" style="FILTER: Alpha(opacity=75)" cellspacing="1" cellpadding="5" bgcolor="#bbbbb" border="0">
<tbody><tr>
<td align="left" bgcolor="#ffffff">
<p><img style="MARGIN: 3px" height="32" alt="数据载入中..." src="images/wait.gif" width="32" align="left" /><strong>数据载入中...</strong><br />
<span>正在载入页面, 请稍候...</span></p></td></tr>
</tbody></table>
</div>
<script language="JavaScript" type="text/javascript">loadBar(1);</script>

　　附上wait.gif图片....

<head> <script type="text/javascript"> 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; } } </script> </head> <body> <body onMouseOver="window.status='喜欢本站,别忘了与朋友分享哦！';return true" onload="loadBar(0)"> <div id="loader"> <table class="loader" style="FILTER: Alpha(opacity=75)" cellspacing="1" cellpadding="5" bgcolor="#bbbbb" border="0"> <tbody><tr> <td align="left" bgcolor="#ffffff"> <p><img style="MARGIN: 3px" height="32" alt="数据载入中..." src="http://www.webjx.com/upfiles/20051204/20051204092945_wait.gif" width="32" align="left" /><strong>数据载入中...</strong><br /> <span>正在载入页面, 请稍候...</span></p></td></tr> </tbody></table> </div> <script language="JavaScript" type="text/javascript">loadBar(1);</script> </body>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

没有相关教程

教程录入：mintao 责任编辑：mintao

上一篇教程：两种漂浮在页面中的广告代码

下一篇教程：几种设为首页的代码

【字体：小大】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】

注：本站部分文章源于互联网，版权归原作者所有！如有侵权，请原作者与本站联系，本站将立即删除！本站文章除特别注明外均可转载，但需注明出处！ [MinTao学以致用网]

　网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！）

同类栏目

· Web开发  · 网页制作
· 平面设计  · 网站运营
· 网站推广  · 搜索优化
· 建站心得  · 站长故事
· 互联动态

热门推荐

没有教程

赞助链接

闵涛博文

500 - 内部服务器错误。

您查找的资源存在问题，因而无法显示。

鄂公网安备 42011102001154号

站长：MinTao ICP备案号：鄂ICP备11006601号-18

闵涛站盟:医药大全-武穴网。A打造B、C、D……