如何在listview填充時在初始加載時顯示加載動畫？

我有一個網頁的iframe（RadTabStrip與MultiPageView），以及什麼是加載到該iframe是另一頁是一個RadListView需要一段時間來加載。其他選項卡/ iframe也是如此。如何在listview填充時在初始加載時顯示加載動畫？

我要的是一個GIF動畫顯示，而列表視圖中繪製。我已經嘗試了一些東西，包括telerik ajax加載面板，但它看起來正在發生的是，即使不會顯示，直到列表完成呈現（它將保持空白，像10秒鐘，然後我會看到裝載機閃光燈瞬間，然後列表中）。

有人可以提供一個解決方案，或者幫助我理解爲什麼頁面拒絕，直到列表視圖完全渲染加載什麼？

頁面顯示該列表時加載。瀏覽器的「加載」指示燈不旋轉，因爲此頁「框」滿載，只是沒有iframe的內容：

enter image description here

然後這只是彈出時其滿載：

enter image description here

來源

2012-03-28 Sinaesthetic

您能否提供鏈接或附上截圖，以便我們可以看到問題？ – 2012-03-28 16:04:49

與PIX – Sinaesthetic 2012-03-28 16:25:44

更新運算您是否嘗試過將加載面板是在iframe中加載的頁面？ – 2012-03-28 16:28:54

我會嘗試使用UpdateProgress控制。我不知道I幀是否會影響它，但這樣的事情應該指向你在正確的方向：

<asp:UpdateProgress ID="prgLoadingStatus" runat="server" DynamicLayout="true"> 
    <ProgressTemplate> 
     <div id="overlay"> 
      <div id="modalprogress"> 
       <div id="theprogress"> 
        <asp:Image ID="imgWaitIcon" runat="server" ImageAlign="AbsMiddle" ImageUrl="/images/wait.gif" /> 
        Please wait... 
       </div> 
      </div> 
     </div> 
    </ProgressTemplate> 
</asp:UpdateProgress>

這裏有一種樣式，您可以根據需要使用調整不透明度：

#overlay { 
    position: fixed; 
    z-index: 99; 
    top: 0px; 
    left: 0px; 
    background-color: #f8f8f8; 
    width: 100%; 
    height: 100%; 
    filter: Alpha(Opacity=90); 
    opacity: 0.9; 
    -moz-opacity: 0.9; 
}    
#theprogress { 
    background-color: #fff; 
    border:1px solid #ccc; 
    padding:10px; 
    width: 300px; 
    height: 30px; 
    line-height:30px; 
    text-align: center; 
    filter: Alpha(Opacity=100); 
    opacity: 1; 
    -moz-opacity: 1; 
} 
#modalprogress { 
    position: absolute; 
    top: 40%; 
    left: 50%; 
    margin: -11px 0 0 -150px; 
    color: #990000; 
    font-weight:bold; 
    font-size:14px; 
}

來源

2012-03-28 16:02:37

是啊，這是行不通的。在列表視圖加載完成之前，我無法顯示任何內容：/ – Sinaesthetic 2012-03-29 16:08:16

您是否嘗試將它放在加載到iframe中的頁面上？ – 2012-03-29 16:09:17

多數民衆贊成在實際上我把它，是的 – Sinaesthetic 2012-04-03 20:26:02

如何在listview填充時在初始加載時顯示加載動畫？

回答

相關問題