点连接提示正在加载然后显示页面

Question

我想弄一个这样的效果，点连接提示正在加载然后显示页面？弹出的这个层后面背景变色，不可操作？怎么做

Answer 1

前台：<div>
    <asp:LinkButton ID="btndel" runat="server" 
            onclick="btndel_Click">Del</asp:LinkButton>
    </div>
    <div id="loading" runat="server" style="position: fixed !important; background-position: center center;
            position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 999;
            background: #000 url(./Images/loading.gif) no-repeat center center; opacity: 0.2;
            filter: alpha(opacity=20); font-size: 14px; line-height: 20px;">
            <p id="loading-one" style="color: #FFFFFF; position: absolute; top: 50%; left: 50%;
                margin: 20px 0 0 -50px; padding: 3px 10px;">
                Page Loading...
            </p>
        </div>
后台: protected void Page_Load(object sender, EventArgs e)
        {
            loading.Visible = false;
        }        protected void btndel_Click(object sender, EventArgs e)
        {
            loading.Visible = true;
        }

Answer 2

<asp:ScriptManager ID="ScriptManager1" runat="server">   
  </asp:ScriptManager>   
  <asp:UpdatePanel ID="upl" runat="server" UpdateMode="Conditional">   
  <ContentTemplate>   
  <asp:UpdateProgress ID="UpdateProgress1" runat="server">   
  <ProgressTemplate>   
  <div>   
  <div>数据加载中，请等待…… </div>   
  </div>   
  </ProgressTemplate>   
  </asp:UpdateProgress>   
</asp:UpdatePanel>     <asp:ScriptManager ID="ScriptManager1" runat="server">   
  </asp:ScriptManager>   
  <asp:UpdatePanel ID="UpdatePanel1" runat="server">   
  <Triggers>   
  <asp:AsyncPostBackTrigger ControlID ="Button1" EventName ="Click" />   
  </Triggers>   
  <ContentTemplate>   
  <asp:Label ID="Label1" runat="server" Text="Label"> </asp:Label>   
  </ContentTemplate>   
  </asp:UpdatePanel>   
  <asp:UpdateProgress ID="UpdateProgress1" runat="server">   
  <ProgressTemplate>   
  <span style =" font-size:12px">数据更新中...... </span>   
  </ProgressTemplate>   
  </asp:UpdateProgress>   
  <asp:Button ID="Button1" runat="server" Text="Button" Width="143px" OnClick="Button1_Click" />   
或使用div显示loading效果   
<script language="javascript" type="text/javascript">   
  document.write(" <div id='loadDiv' style='padding-top: 250px; padding-left: 350px;font-size:x-large;height:400px'> <span id='loading'> <img src=\"../Images/loader2.gif\"/>正在加载数据，请稍候··· </span> </div>");   
  window.onload = function()   
  {   
  document.getElementById("hiddenDiv").style.display="";   
  document.getElementById("loadDiv").parentNode.removeChild(document.getElementById("loadDiv"));   
    
  }   
  </script> 

Answer 3

很简单的。主要运用z-Index
<div id='d1' style='display:none'>//一个外层框架层，
  <div > 阻挡层背景灰色的</div>//一直都显示
  <div id='msg'>你的信息</msg>
</div>
显示就 d1.style.display='block'
不显示就none
唉现在这些技术思想我都用不到了。怀才不遇悲哀。