我以前项目写的一个小东西你看看。
ajax开始前调用addoverlay,回调函数调用removeoverlay
JS部分:
function addoverlay() {
imgLoader = new Image(); // preload image 预加载
imgLoader.src = "../images/loadingAnimation.gif"; //选一张loading图片,就是转啊转的那种
$("body").append("
");
$("body").append("
"); //add loader to the page
$('.loadingimg').show();
}
function removeoverlay() {
$('.overlaydiv').remove();
$('.loadingimg').remove();
}
css部分:
.overlaydiv
{
position: fixed;
z-index:100;
top: 0px;
left: 0px;
height:100%;
width:100%;
background-color:#000;
filter:alpha(opacity=75);
-moz-opacity: 0.75;
opacity: 0.75;
}
.loadingimg{
position: fixed;
display:none;
height:13px;
width:208px;
z-index:103;
top: 50%;
left: 50%;
margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}
* html .loadingimg { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}