• ベストアンサー

ホームページ、データを読み込むまでの時間…

HPであるデーターを画面表示させています。しかし読み込みまで少し時間がかかるため、そのあいだ砂時計などの画像を、表示させたいのですが、どのようにすれば実現できるでしょうか? もしくは「少しお待ち下さい」のような文章を、ロード時間のみに表示させる方法でも構いません。

質問者が選んだベストアンサー

  • ベストアンサー
  • LancerVII
  • ベストアンサー率51% (1060/2054)
回答No.1

こんにちは。 データの表示部分を切り離せるのであればAjaxを利用すると比較的簡単に実現できると思います。 例えば下のサンプルですと画面表示時にはデータの表示は行っていません。 まず表示用の画面がロード後に「Now Loading...」の文字を点滅させます。 その後$('#list').load ( 'load.php' );によってデータの表示を実行しています。 load.phpでの処理が終わってデータが帰ってきたら<div id="list">の中身が変更されますので、必然的にNow Loadingが消え、データの表示がされます。 <html lang="ja"> <head> <meta charset="utf-8"> <title>サンプル</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <script> $().ready ( function() { setInterval ( function() { $('#list p').fadeOut ( 300, function() { $(this).fadeIn(300) } ); }, 600 ); $('#list').load ( 'load.php' ); }); </script> <style> #list p { color: #f00; font-weight: bold; } </style> </head> <body> <h1>○○履歴一覧</h1> <hr /> <div id="list"> <p>Now Loading...</p> </div> </body> </html>

関連するQ&A