2

重複の可能性：
ページの読み込み/レンダリングが完了するまで、ページの読み込み中の画像/div/テキストを表示する方法

jqueryを使ってページ全体の読み込み画面を表示したい。以前に読み込みを使用したことがないので、混乱しています。私がやりたいのは、すべてのスクリプト css イメージとコンテンツが読み込まれるまで、他の要素を非表示にすることだけです。どうすればいいのですか？

4

1 に答える 1

8

非常に簡単です：

  1. 画面いっぱいに div を作成します。読み込み中の画像やテキストをそこに入れることができます
  2. HTMLファイルの最後、またはjquery $(document).ready(function(){ ... });を使用して div を削除します。
  3. あなたはすべての「画像」について言及しました...そのためには少し余分に必要かもしれません。

SO、HTMLで、幅と高さが100％の固定または絶対divを作成します..（スクロールバーがないように、オーバーフローを非表示にすることをお勧めします（幅+パディング+マージン=> 100％）

<div id='loading_wrap' style='position:fixed; height:100%; width:100%; overflow:hidden; top:0; left:0;'>Loading, please wait.</div>

次のように頭に入れることができます。

<script type='text'javascript'>
$(document).ready(function(){
    $('#loading_wrap').remove();
});
</script>

または、これを HTML ページの最後 (HTML 終了タグの直前) に追加します。

<script type="text/javascript">$('#loading_wrap').remove();</script>

これは、写真がロードされるのを待たない可能性があります。これは、.remove(); をトリガーする前に写真がロードされているかどうかを確認するループになるためです。

于 2012-10-21T03:23:33.040 に答える