0
我沒有使用ProgressBar插件,而是使用下面的腳本來顯示異步的進度條。頁面上的請求。任何人都可以提供反饋,如果它是瀏覽器兼容的,等等。我上週在codereview上提出了這個問題,但沒有得到任何迴應,所以試試這裏。使用JQuery顯示異步請求的進度條
<div class="overlay">
<div class="progress">
<img src="@Url.Content("~/content/images/loading.gif")" />Loading...
</div>
</div>
//displays progress bar
$('.overlay').ajaxStart(function() {
$(this).css({ height: $(document).height(), width: $(document).width() }).show();
$(this).find(".progress").css({ top: $(window).height()/2, left: $(window).width()/2 });
}).ajaxStop(function() {
$(this).hide();
});
.overlay
{
position: fixed !important;
position: absolute; /*ie6*/
width: 100%;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: #000;
filter: alpha(opacity=20);
opacity: 0.2;
-moz-opacity: 0.2;
-khtml-opacity: 0.2;
-webkit-opacity: 0.2;
z-index: 10004;
display: none;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20); /*ie6*/
}
.overlay .progress
{
position: absolute;
z-index: 10005;
background: #fff;
color: #000;
}