loading image on button click in asp.net using c#,javascript

 <script type="text/javascript" src="http://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("modal");
                $('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 () {
            ShowProgress();
        });
        
</script>

    .modal
    {
        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>



<asp:Button ID="btn1" runat="server" Text="sample" onclick="btn1_Click" />
    <div style='width:680px; height:332px;  margin-left:80px; overflow:auto; margin-top:5px;'>
       <dx:ASPxGridView ID="ASPxGridView1" runat="server" Width="627px">
         </dx:ASPxGridView>
            <asp:Button ID="btnsample" runat="server" Text="Load Grid"
            onclick="btnsample_Click" />
           </div>
           </div>
           <div>
    <%-- <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>--%>

             <div class="loading" align="center">
    Loading. Please wait.<br />
    <br />
    <img src="Images/preload.gif" alt="" />
</div>

load the data in button click event


and also we can do this same as in dropdown selection also for dropdown call the javascript function on dropdown onchange event

Loading gif Image on i frame loading

<script type="text/javascript">
        function hideLoading() {
            document.getElementById('divLoading').style.display = "none";
            document.getElementById('divFrameHolder').style.display = "block";
        }
    </script>

 <div id="divLoading">

        <asp:Image ID="imgloading" runat="server" ImageUrl="Images/preload.gif" />
    </div>
    <div id="divFrameHolder" style="display:none">
        <iframe src="LoadData.aspx" onload="hideLoading()" frameborder="1" scrolling="auto" width="650px;" height="500px">
     
        </iframe>
    </div>

Super Script to a radio button text(Trade Mark)

There is a ready TM character in unicode character set which should be already in superscript, it is0x2122. You can also write the TM character directly into the C# code or designer properties (you get the character by copying it from character map, or pressing Alt and  0153 from numpad). The character is available at least in font Microsoft Sans Serif (which should be a default for radio button).


radioButton1.Text = "MyProduct™";
radioButton2.Text = "MyProduct2" + (char)0x2122;