UpdateProgress

Design Code :

<style type="text/css">

        .modal {

            position: fixed;

            z-index: 999;

            height: 100%;

            width: 100%;

            top: 0;

            background-color: Black;

            opacity: 0.6;

        }

        .center {

            z-index: 1000;

            margin: 300px auto;

            padding: 10px;

            width: 130px;

        }

            .center img {

                height: 128px;

                width: 128px;

            }

    </style>

    <form id="form1" runat="server">

        <asp:ScriptManager runat="server"></asp:ScriptManager>

        <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">

            <ProgressTemplate>

                <div class="modal">

                    <div class="center">

                        <img alt="" src="loader.gif" />

                    </div>

                </div>

            </ProgressTemplate>

        </asp:UpdateProgress>

        <asp:UpdatePanel ID="UpdatePanel1" runat="server">

            <ContentTemplate>

                <div style="text-align:center;">

                    <asp:Button ID="Button1" Text="Click Me" runat="server" OnClick="Button1_Click" />

                </div>

            </ContentTemplate>

        </asp:UpdatePanel>

    </form>

Put code in code behind (.cs) file.

protected void Button1_Click(object sender, EventArgs e)

    {

        System.Threading.Thread.Sleep(5000);

    }

Output :