WordPress网站添加加载进度条的方法

这个方法理论适用于大部分建站程序。

其实就是使用jquery库来完成的，在加载到代码是显示一个条出来，然后控制这个条的宽度，把带有宽度的语句添加到合适的位置就可以达到加载进度显示的目的了，是很简单的，下面我们分享一下代码：

1、在header.php中添加

<div id="w-loading"><div></div></div>  
<script type="text/javascript">  
jQuery("#w-loading div").animate({width:"33%"});  
</script>  

2、添加jQuery代码到footer.php

<script type="text/javascript">  jQuery(document).ready(function(){  jQuery("#w-loading div").animate({width:"100%"},800,function(){  setTimeout(function(){jQuery("#w-loading div").fadeOut(500);  });  });  });  </script>   

3、添加CSS代码到style.css文件

#w-loading{z-index:2468170656;position:absolute;left:0;top:0;width:100%;height:25px;}  
#w-loading div{width:0;height:25px;background:#ccc;}  

本网站暂时没有保留下截图，之前调试过，是可以用的，大家修改之前做好备份就可以了。

👋 感谢您的观看！