一个基于jquery的页面预载入效果(loading)

1,在代码<head></head>里加入以下jquery:

[javascript] view plain copy
  1. $(window).load(function(){  
  2.     $("#loading").hide();  
  3. })  

 

2,在里<body></body>加入以下代码:

[xhtml] view plain copy
  1. <div id="loading">  
  2. Loading content, please wait..  
  3. <img src="loading.gif" mce_src="loading.gif" alt="loading.." />  
  4. </div>  

 

在里的这代码必须保证在网页载入的最前面。

接着是css代码:

 

[xhtml] view plain copy
  1. #loading{  
  2. position:absolute;  
  3. width:300px;  
  4. top:0px;  
  5. left:50%;  
  6. margin-left:-150px;  
  7. text-align:center;  
  8. padding:7px 0 0 0;  
  9. font:bold 11px Arial, Helvetica, sans-serif;  
  10. }  

 

一个基于jquery的loading效果就完成咯。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章