進度條隱藏頁面直到頁面完全加載

我的網頁從0.5秒--3秒內完成加載。我只是想知道是否有一種方法可以在加載頁面之前顯示疊加層。當頁面加載完成後，我想要隱藏這個疊加層。就像進度條或.gif一樣。我在MVC3中使用剃鬚刀引擎。進度條隱藏頁面直到頁面完全加載

2012-05-08 moutonc

不要這樣做;這是不好的用戶體驗。相反，[找到方法]（https://developers.google.com/speed/pagespeed/）可讓您的網頁加載速度更快。 – josh3736

沒有用戶。這個網頁應該做的是檢查失敗的構建。它將在一個信息亭上，當我的動畫發生時，這是延遲的原因。該動畫是滾動任何Div的scrollTo函數。有一個滾動框 – moutonc

在這種情況下，爲什麼不使用AJAX來加載構建狀態？ – josh3736

我已經做了三件事情來做這件事：PS，對不起的代碼塊，對所有這些都是新的。

HTML DIV：

<div id ="blocker"> 
<div>Loading...</div></div>

CSS：

#blocker{position: fixed; 


top: 0; 
left: 0; 
width: 100%; 
height: 100%; 
background-color: #000; 
z-index: 1000; 
opacity: 0.3; 
display: none;

}

#blocker div 
    { position: absolute; 
    top: 50%; 
    left: 50%; 
    width: 5em; 
    height: 2em; 
    margin: -1em 0 0 -2.5em; 
    color: #fff; 
    font-weight: bold; 
}

阿賈克斯之前的JQuery被調用：

$("#blocker").show();

$.ajax`

來源

2012-05-09 16:55:05 moutonc

我要做的就是：

var loadingTimeout; 

$j('body').ajaxStart(function() { 
    loadingTimeout= setTimeout(function() { 
     $("#blocker").show(); 
    }, 1000); 
}); 

$j('body').ajaxStop(function() { 
    clearTimeout(loadingTimeout); 
    $("#blocker").hide(); 
});

在每個AjaxCall的在您的網頁發出，您攔截得到1秒後顯示。當客戶得到響應時，該塊會再次隱藏起來。你怎麼看？

來源

2012-05-11 13:21:34 iappwebdev

我在下面設置它的方式基本上是在頁面加載時，它會保持阻塞程序一直加載。假設頁面加載需要半毫秒，它不會顯示它;雖然這可以在每秒顯示1秒的情況下工作，但可能無法100％正常工作，但數據可能會加載緩慢。 – moutonc

進度條隱藏頁面直到頁面完全加載

回答

相關問題