Maison  >  Article  >  interface Web  >  JS实现页面加载时带loading进度条

JS实现页面加载时带loading进度条

高洛峰
高洛峰original
2016-12-16 16:53:131923parcourir

JS实现页面加载时带loading进度条

页面加载时loading实现方法

loading实现大概就这个意思,首先将要显示的内容隐藏,先显示loading文字或图片什么的,然后文档加载完毕后将内容显示出来,loading隐藏掉就好了。

这里我用到了jquery,用不用无所谓。

<html> 
<head> 
<script language="javascript" type="text/javascript" src="jquery-1.6.1.js">
</script> 
/** * 页面加载完成后显示页面 */ 
function showPage(){ $(&#39;#divPageLoading&#39;).remove(); 
$(&#39;#divPageBody&#39;).show(); } 
</head>
 <body onload="showPage();"> 
 <div id="divPageLoading"> 
 <img src="pageloading.gif" style="width:120px;height:120px;position:absolute;left:45%;top:40%;"/> 
 </div>
  <div id="divPageBody" style="display:none;"> …… 
 </div> 
 </body> 
 </html>



更多JS实现页面加载时带loading进度条相关文章请关注PHP中文网!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent:JS 实现带进度条的页面跳转特效Article suivant:js发送邮件