$(function () {
$(document).ajaxStart(function () {
//alert("正在加载");
$(".loadDiv").show();
}).ajaxStop(function () {
//alert("结束加载");
$(".loadDiv").hide(300);
});
})
样式
.loadDiv {
top: 40%;
left: 30%;
position: fixed;
background-color: #333333;
border: solid 2px #999999;
z-index: 2;
border-radius: 10px;
width: 395px;
height: 235px;
opacity: 0.9;
}
.loadDivT {
margin-left: 20px;
height: 80px;
line-height: 87px;
color: #fff;
font-size: 45px;
}
.hr1 {
height: 1px;
border: none;
border-top: 1px solid #c6c6c6;
}
.loadDivC {
padding-top: 30px;
margin-left: 30px;
color: #c6c6c6;
font-size: 35px;
}
.loadDivC img{
width:35px;
}
.loadDivC span{
vertical-align: top;
}
前台
<div class="loadDiv">
<div class="loadDivT">◎ 请稍后</div>
<hr class="hr1" />
<div class="loadDivC">
<img src="img/Loading4.gif" />
<span>正在加载...</span>
</div>
</div>