html

---

 

<div id="loading"><img src="img/load1.gif" id="loading" /></div>

 

css

---

#loading {

position: fixed;

top: 0;

left: 0;

width: 100%;

height: 100%;

z-index: 2000;

opacity: 1;

}

#loading img {

width: 100%;

position: absolute;

z-index: 2001;

}

 

js

---

 

 

//监听加载状态改变

document.onreadystatechange = completeLoading;

//加载状态为complete时移除loading效果

function completeLoading() {

if (document.readyState == "complete") {

$("#loading").animate({

"opacity": "0"

}, 500).hide(1000);

}

}