WEB开发网
开发学院网页设计JavaScript 真正的 用JS 做的 loading 阅读

真正的 用JS 做的 loading

 2007-11-27 16:11:05 来源:WEB开发网   
核心提示:这个loading 需要2个页面的的支持,还可以为一个站点的所有html设置这个loading程序<!--=--><!-- index.htm---><!--=--><html><head><meta http-equiv=Content-Type co

这个loading 需要2个页面的的支持,还可以为一个站点的所有html设置这个loading程序
<!--=================================-->
<!-- index.htm--->
<!--=================================-->
<html><head>
<meta http-equiv=Content-Type content=text/html; charset=gb2312>
<title>您正在访问 http://m9m.nease.net 的网站......</title>
</head>
<frameset rows=0,* name=frm border=0>
  <frame src=about:about name=t  border=0>
  <frame src=loading.htm name=d border=0>
</frameset>
<noframes><body>
您的浏览器不支持frames......
</body></noframes></html>

<!--=================================-->
<!-- loading.htm--->
<!--=================================-->
<html>
<head>
<meta http-equiv=Content-Type content=text/html; charset=gb2312>
<SCRIPT src=to.js>
</SCRIPT>
<body>
<SCRIPT>
showdiv();
 wturl(i.html); // 您的网站的真正 index.htm
</SCRIPT></body></html>

<!--=================================-->
<!-- to.js -->
<!--=================================-->
document.write(<STYLE type=text/css>.btn {BORDER-RIGHT: #c0c0c0 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #c0c0c0 1px solid; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0c0c0 1px solid; CURSOR: default; COLOR: #000000; PADDING-TOP: 1px; BORDER-BOTTOM: #c0c0c0 1px solid; BACKGROUND-COLOR: #c0c0c0}\
.btu { BORDER-RIGHT: #999999 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #ffffff 1px solid; PADDING-LEFT: 1px; FLOAT: none; PADDING-BOTTOM: 1px; BORDER-LEFT: #ffffff 1px solid; CURSOR: default; COLOR: #000000; PADDING-TOP: 1px; BORDER-BOTTOM: #999999 1px solid; BACKGROUND-COLOR: #c0c0c0}</STYLE>);

function WriteButton(fnFunctionName, ButtonValue, ButtonURL, wd)
{
   var strTmp = ,n = 0;
   if (fnFunctionName == )
   strTmp = self.location = + ButtonURL + ;;
 else
   strTmp = fnFunctionName + ();;
 for(var i = 0; i < ButtonValue.length; i++)
 {
  var c = ButtonValue.substr(i, 1);
  if( c > z || c < A)
    n += 2;
  else
    n += 1;
 }
 if( wd == ) wd = (n * 8);

 document.write(<table title=+ButtonURL+ width= + wd + ><tr><TD align=center class=btn onmouseup=\javascript:this.className=btu\ onmousedown=\javascript:this.className=btd\ onmouseover=\javascript:this.className=btu\ style=\FONT-SIZE:12px;TEXT-DECORATION:none\ onclick=\javascript:this.className=btd; + strTmp + \ onmouseout=\javascript:this.className=btn\> + ButtonValue + </TD></tr></table>);
}

function wtdiv()
{
  document.write(<div id=stdiv style=position:absolute; width:350px; height:115px; z-index:1; left: 30%; top: 35%;visibility: hidden;><table width=100% height=100%  border=1 bordercolor=#000000 bordercolordark=#ffffff cellspacing=0 cellpadding=0><tr><td height=22 bgcolor=#bbbbbb><SCRIPT>WriteButton(\\, \欢迎您<span id=ipn></span>访问我的计算机....\, \http://m9m.nease.net\, \100%\);</SCRIPT></td></tr><tr><td align=center bgcolor=#CCCCCC><br>系统正在运行中,请耐心等待.<br>等待时间:<font color=red><span id=wtime></span></font>秒</td></tr></table></div>);
}
wtdiv();

function openwin()
{
   if(self == window.parent.frames[t] && top.parent.frm)
 top.parent.frm.rows = *,0;
   else if(top.parent.frm) top.parent.frm.rows = 0,*;
}

var wt = 0, n = 0;
function countwt()
{
  if (wt)
   clearTimeout(wt);
  wtime.innerHTML = + n++ ;
  wt = setTimeout(countwt();, 1000);
}


function showdiv()
{
     openwin();
 document.getElementById(stdiv).style.visibility = visible;
     countwt();
}
openwin();

<!--=================================-->
<!--    h.js -->
<!--=================================-->
if(self != window.parent.frames[t] && window.parent.frames[t])
   window.parent.frames[t].showdiv();
else if(self == window.parent.frames[d] && window.parent.frames[d])
   window.parent.frames[d].showdiv();

最后的说明
在您的i.htm,也就是您的真正的index.htm首页里加入如下代码就可以
<body>后加
<script src=h.js></SCRIPT>
</body>前加入
<script src=to.js></SCRIPT>
就可以了

不明白的可以访问我的网站 http://m9m.nease.net 或 来信和我交流
QQ: 11602011

Tags:真正 JS loading

编辑录入:coldstar [复制链接] [打 印]
赞助商链接