How to block the ASP.NET page while ajax UpdateProgress is being displayed

Write the css style :

<style type="text/css">
      .hide
      {
          display: none;
      }
      .show
      {
          display: inherit;
      }
       .progressBackgroundFilter
      {
          position: absolute;
          top: 0px;
          bottom: 0px;
          left: 0px;
          right: 0px;
          overflow: hidden;
          padding: 0;
          margin: 0;
          background-color: #000;
          filter: alpha(opacity=50);
          opacity: 0.5;
          z-index: 1000;
      }
      .processMessage
      {
          position: absolute;
          font-family:Verdana;
          font-size:12px;
          font-weight:normal;
          color:#000066;
          top: 30%;
          left: 43%;
          padding: 10px;
          width: 18%;
          z-index: 1001;
          background-color: #fff;
      }
  </style>

Design the Update progress as below :

<asp:UpdateProgress ID="updPrgsBaselineTab" runat="server">
       <ProgressTemplate>
           <div id="progressBackgroundFilter" class="progressBackgroundFilter">
           </div>
           <div id="processMessage" class="processMessage">
               <table width="100%">
                   <tr style="width: 100%">
                       <td style="width: 100%">
                           Please Wait..........
                       </td>
                   </tr>
                   <tr style="width: 100%">
                       <td style="width: 100%" align="center">
                           <img src="../Images/Update_Progress.gif" />
                       </td>
                   </tr>
               </table>
           </div>
       </ProgressTemplate>
   </asp:UpdateProgress>