js兑现页面加载的等待效果
日期：2014-05-16 浏览次数：20374 次
js实现页面加载的等待效果
页面实现加载时的等待效果
原理是在需要等待的页面区域加一个层先覆盖加载中的页面,等待数据加载完成后把层隐藏掉
<div id="ld" style="position:absolute; left:-1px; top:1px; width:100%; height:100%; background-color:#FFFFFF; z-index:1000;">
<div id="center" style="position:absolute;">
<table border="0">
<tr><td><span id="disp">页面加载中,请等待...</span></td></tr>
<tr><td><img src="/common/image/2.gif"></td></tr>
</table>
</div>
</div>
<script language="JavaScript">
function winload(){
ld.style.display="none";
f8=true;
}
</script>
<div onload="winload();">
有些时候页面加载时间很短,就看不到等待的效果,可以把onload函数改成下面的,就可以看到效果了
<script language="JavaScript">
function winload(){
setTimeout(
function(){
alert("111111");
ld.style.display="none";
f8=true;
},1000);
}
</script>
div部分的代码写在<head>之后
页面实现加载时的等待效果
原理是在需要等待的页面区域加一个层先覆盖加载中的页面,等待数据加载完成后把层隐藏掉
<div id="ld" style="position:absolute; left:-1px; top:1px; width:100%; height:100%; background-color:#FFFFFF; z-index:1000;">
<div id="center" style="position:absolute;">
<table border="0">
<tr><td><span id="disp">页面加载中,请等待...</span></td></tr>
<tr><td><img src="/common/image/2.gif"></td></tr>
</table>
</div>
</div>
<script language="JavaScript">
function winload(){
ld.style.display="none";
f8=true;
}
</script>
<div onload="winload();">
有些时候页面加载时间很短,就看不到等待的效果,可以把onload函数改成下面的,就可以看到效果了
<script language="JavaScript">
function winload(){
setTimeout(
function(){
alert("111111");
ld.style.display="none";
f8=true;
},1000);
}
</script>
div部分的代码写在<head>之后
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
