asp.net - Asp.net は、ページの更新中に待機インジケーターを表示します (F5)

Question

このページの例を使用すると、送信ケースで問題なく動作します。

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

ただし、ユーザーがページを更新すると (ブラウザーの更新ボタンまたは F5 によって)、このインジケーターは表示されません。unload/load イベントを使用してみましたが、うまくいきません。誰にもアイデアはありますか？

前もって感謝します！

Answer 1

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;
}

ページの読み込みが下部で完了したら、javascript を記述して読み込みクラスを削除できます。

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

これがそのサイトの実際の例です。

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