0

更新の進行状況コントロールを配置したWebページがあります。更新の進行状況が開始すると、ページ全体がグレー表示になり、完了するとページが元の状態に戻ります。以下は、更新の進行状況のために追加したコードです：-

<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>

ページをグレー表示する方法を教えてください。可能であれば、コードも提供してください。前もって感謝します。

4

2 に答える 2

6

少しの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;
}

コンテナを基準にして位置を設定し、それに高さを指定するか、それに応じてオーバーフローの高さを設定する必要があります。次に、画像を中央に配置するなどのスタイルを設定することもできます。

于 2012-05-21T09:14:52.973 に答える
0

1つの単純なdivを使用してから、以下のようなajaxStartイベントとajaxStopイベントを使用できます。

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

$('#cover').hide().ajaxStart(function () {$(this).fadeIn(100);}).ajaxStop(function() {  $(this).fadeOut(100);});
于 2015-05-15T05:28:28.873 に答える