Asp.net show waiting indicator while refresh page (F5)

1.1k views Asked by At

I use the example in this page and it works ok for submit cases.

http://www.aspsnippets.com/Articles/Display-loading-image-while-PostBack-calls-in-ASPNet.aspx

but when user refresh page (by button refresh of brower or F5) this indicator is not shown. I tried using unload/load event but it doesn't work. Does anyone have any ideas?

Thanks in advance!

2

There are 2 answers

2
Jalpesh Vadgama On

This is how you can do with CSS.

http://tjvantoll.com/2013/04/24/showing-a-css-based-loading-animation-while-your-site-loads/

html {
      -webkit-transition: background-color 1s;
      transition: background-color 1s;
    }
html, body {
      /* For the loading indicator to be vertically centered ensure */
      /* the html and body elements take up the full viewport */
       min-height: 100%;
}
html.loading {
      /* Replace #333 with the background-color of your choice */
      /* Replace loading.gif with the loading image of your choice */
      background: #333 url('loading.gif') no-repeat 50% 50%;

      /* Ensures that the transition only runs in one direction */
     -webkit-transition: background-color 0;
     transition: background-color 0;
  }
  body {
        -webkit-transition: opacity 1s ease-in;
         transition: opacity 1s ease-in;
  }
 html.loading body {
     /* Make the contents of the body opaque during loading */
      opacity: 0;

      /* Ensures that the transition only runs in one direction */
    -webkit-transition: opacity 0;
    transition: opacity 0;
}

And once your page load completed at the bottom you can write a javascript to remove loading class.

$( "html" ).removeClass( "loading" );

Here is the live example of that site.

http://tjvantoll.com/demos/2013-04-24/loading.html

0
S.A. Khalili On

I use Telerik Radmenu in my asp.net project, what I did was to add the showProgress javascript with a different name in my Master page and on radMenu OnClientItemClicked call the javascript funciton.

If you are not using Telerik, try to call the javascript function from you navigation bar using a tag. Test enter link description here