顯示主頁面正在準備時的載入頁面

我想在主頁面正在準備載入時顯示預載入圖像。我想我不能使用Ajax，因爲我需要重新加載整個主頁面。我想實現下一步：首先，我請求預載頁面，服務器將它發送給我。其次，服務器開始形成主頁面（大約需要15-20秒）。第三，當服務器結束工作時，它會將主頁發送給我。但是我怎樣才能實現第三部分？顯示主頁面正在準備時的載入頁面

第二個想法是將主頁分爲兩部分。其中之一是預加載頁面，其中包含整個主頁面的內容，而不包含'busy time'內容。然後使用Ajax加載'busy time'內容。

您認爲什麼，同事？

來源

2012-04-28 Nolesh

什麼我們意味着什麼？ – ajax333221 2012-04-28 00:16:43

你想在登錄時使用類似gmail的東西嗎？ – 2012-04-28 00:20:09

試試這個。你需要一個加載微調元素。另外，$（function（）{}）;在加載DOM（html結構）時激活。這是訪問者首次訪問該頁面時所能達到的最接近的結果。 body元素被隱藏，然後等待所有的圖像和所有的東西都完全渲染，並且CSS和Javascript文件被加載並工作，然後它從微調器交叉淡入內容並移除微調器。

$(function(){ 
    $('body').hide(); 
    $('html').append('<div id="loading-spinner"></div>'); 
    $('body').load(function(){ 
     $('#loading-spinner').fadeOut('fast').remove(); 
     $(this).fadeIn('fast'); 
    }); 
});

你需要一些CSS的GIF適用於裝載微調元素的背景和居中：

#loading-spinner { 
    width:100px; 
    height:100px; 
    background:url(loading.gif); 
    left:50%; 
    margin-left:-50px; 
    top:50%; 
    margin-top:-50px; 
}

來源

2012-04-28 00:52:08 alt

顯示主頁面正在準備時的載入頁面

回答

相關問題