在页面中载入进度条，是一种常见的特效。它比较实用，当页面的元素比较多的时候，使用它可以让网友不至于等的着急。其原理很简单：在网页的头部放置一个文字或者图片的 loading 状态，然后页尾载入一段 JS 隐藏掉，即根据浏览器的载入顺序来实现的简易 Loading 状态条。 此效果也有插件可实现，不过此次分享的是自定义方法。
效果
demo
http://build.gzwhir.com/Whir_WEB/jsdemo/loading_1/index.shtml
如何实现呢？
1、首先在开始的地方放置
<body>
<div id="loading"></div>
</body>
2、在和之间放置样式和jquery框架
3、给loading层设置样式
<style type="text/css">
#loading{z-index:1;padding:5px 0 5px 29px;
background:url(images/loadingwy.gif) no-repeat 10px top;left:0;top:0;width:90px;
position:fixed; height:21px}
</style>4、在页面的底部放置
<script type="text/javascript">
$("#loading").fadeOut(3000)
</script>