更新進度期間灰色網頁在ASP.NET中運行

Question

我有一個網頁，我已經把更新進度control.I希望隨着更新進度開始，整個頁面將灰色，並且當它完成頁面將恢復到原來的狀態。 下面是我的更新進度已添加的代碼： -

<div class="divTextAlign"> 
      <asp:Updateprogress id="updProgress" runat="server" dynamiclayout="true" associatedupdatepanelid="updForgotPassword"> 
       <Progresstemplate> 
        <img src="App_Themes/Images/ajax-loader.gif" alt="" /> 
       </Progresstemplate> 
     </asp:Updateprogress> 

請讓我知道，我怎麼變成灰色的頁面，如果可能的話也請提供代碼。 在此先感謝。

Answer 1

CSS的一位可以爲你做到這一點 -

aspx頁面

<Progresstemplate> 
    <div class="overlay"> 
     <img src="App_Themes/Images/ajax-loader.gif" alt="" /> 
    </div> 
</Progresstemplate> 

CSS

.overlay 
{ 
position: absolute; 
background-color: white; 
top: 0px; 
left: 0px; 
width: 100%; 
height: 100%; 
opacity: 0.8; 
-moz-opacity: 0.8; 
filter: alpha(opacity=80); 
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; 
z-index: 10000; 
} 

您需要的位置設置爲相對於容器，也給它一個高度，或相應地設置溢出的高度。那麼你也可以風格爲中心的圖像等

Answer 2

您可以使用一個簡單的div，然後使用ajaxStart和ajaxStop事件，如下面

<div id="cover"></div> 

$('#cover').hide().ajaxStart(function() {$(this).fadeIn(100);}).ajaxStop(function() { $(this).fadeOut(100);});