Display (Show) Loading Progress GIF image on specific (particular) Button Click in ASP.Net

Hi thereallover0...,

Refer below sample.

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    function ShowProgress() {
        setTimeout(function () {
            var modal = $('<div />');
            modal.addClass("modalDiv");
            $('body').append(modal);
            var loading = $(".loading");
            loading.show();
            var top = Math.max($(window).height() / 2 - loading[0].offsetHeight / 2, 0);
            var left = Math.max($(window).width() / 2 - loading[0].offsetWidth / 2, 0);
            loading.css({ top: top, left: left });
        }, 200);
    }
    $('form').live("submit", function () {
        var $btn = $(document.activeElement);
        if ($btn.val() == 'Load') {
            ShowProgress();
        }
    });
</script>
<style type="text/css">
    .modalDiv {
        position: fixed;
        top: 0;
        left: 0;
        background-color: black;
        z-index: 99;
        opacity: 0.8;
        filter: alpha(opacity=80);
        -moz-opacity: 0.8;
        min-height: 100%;
        width: 100%;
    }

    .loading {
        font-family: Arial;
        font-size: 10pt;
        border: 5px solid #67CFF5;
        width: 200px;
        height: 100px;
        display: none;
        position: fixed;
        background-color: White;
        z-index: 999;
    }
</style>
<div class="button-list">
    <asp:Button ID="btnLoad" runat="server" Text="Load" OnClick="btnLoad_Click"
        CssClass="btn btn-success btn-bordered w-md btn-bordered col-md-1" />
    <br /><br />
    <asp:Button ID="btnSubmit" runat="server" Text="Submit"
        CssClass="btn btn-success btn-bordered w-md btn-bordered col-md-1" />
</div>
<div class="loading" align="center">
    Loading. Please wait.   
    <br />
    <br />
    <div class="d-flex justify-content-center">
        <div class="spinner-border text-success" role="status">
            <span class="sr-only">Loading...</span>
        </div>
    </div>
    <br />
    <br />
</div>

Code

C#

protected void btnLoad_Click(object sender, EventArgs e)
{
    System.Threading.Thread.Sleep(3000);
    // Bind GridView.
}

VB.Net

Protected Sub btnLoad_Click(ByVal sender As Object, ByVal e As EventArgs)
    System.Threading.Thread.Sleep(3000)
    ' Bind GridView.
End Sub

Screenshot