做出数据载入中的效果_转摘

摘自:http://hi.baidu.com/aspnet20/blog/item/e8ac73cfb547873df9dc6175.html

       如果数据太多,页面数据加载就会变慢。在等待数据的传输过程中我们总要给浏览者一点提示什么的吧,为了达到这样的目的,我们可以采用如下的方法.
第一种方法:
<div id=divMsg width=800 height=200>正在读取数据,请稍候..</div>

<!--需要显示的数据-->

<script language=javascript> 
window.divMsg.style.display
="none"
</script>



需要显示的数据放在二者之间。

第二种方法,我是从blogcn的代码里面抽出来的。
<html>
<head>
     
<title>test</title>
</head>

<body>
<script>
function chkdiv(divid){
  
var chkid=document.getElementById(divid);
  
if(chkid != null){return true; }
  
else {return false; }
}

</script>

<div id="comment">数据载入中</div>
</body>
</html>

<script>if (chkdiv('comment')) {document.getElementById('comment').innerHTML='Content';}</script>



把Content的部分换成你需要的内容。



第三种:给网站延时添加"正在加载数据"的修改
第一步: 
先在网页头部加上:
<script language="Javascript"> 
<!-- 
var t_id = setInterval(animate,20); 
var pos=0
var dir=2
var len=0
function animate()
var elem = document.getElementById('progress'); 
if(elem != null
if (pos==0) len += dir; 
if (len>32 || pos>79) pos += dir; 
if (pos>79) len -= dir; 
if (pos>79 && len==0) pos=0
elem.style.left 
= pos; 
elem.style.width 
= len;}
}
 
function remove_loading() 
this.clearInterval(t_id); 
var targelem = document.getElementById('loader_container'); 
targelem.style.display
='none'; 
targelem.style.visibility
='hidden';}
 
//--> 
</script> 

此步可以写在joekoe_functions.js文件里!但先要把:<script language="Javascript"
<!-- 
******** 
//--></script>删去!

第二步: 
修改<body > 
以下为代码内容:
<body leftmargin="0" topmargin="0" onLoad="remove_loading();"> 
<div id="loader_container"><div id="loader"><div align="center">正在加载页面数据 </div><div id="loader_bg"><div id="progress"></div></div></div></div>

posted on 2006-09-27 13:45    阅读(401)  评论(0编辑  收藏  举报

导航