えっ、当然ブロードバンドっすよ、何か？みたいな世の中なんで、果たしてどれくらい効果があるのか分からないのかも知れないんだけれども、ちょっとばかし重たい画像があったとして、その画像の読み込み中に味気ない空白を見つめているよりは、読み込み中を表すインジケータのアニメーション GIF を用意して img 要素の背景画像に指定しておけばナローバンドな環境にも配慮できるでしょ？（超意訳）みたいな小技が maratz.com » archive » Image Preloader で大分前に紹介されてたのを見つけたんでやってみた。
img {
display: block;
background: #fff url(progressbar_long.gif) center center no-repeat;
}全然、分かんね。Ctrl+F5 とか連打しても、なんか動いてないような気が。
- 背景画像に指定しているアニメーション GIF
- AJAX Activity Indicators から拝借
Comments
う～ん、微妙（笑
使われている画像のせいかもしれませんが…
あっ、始めまして。
ちょくちょくロムらせて頂いております。m(_ _)m
はじめまして。
こちら ADSL1.5M 損失30db ですが、3秒間程アニメーション GIF が表示されています。
サンプルが正常だということはわかりましたが、うちの回線が遅いということもよくわかりました・・・。
>>ma☆ce さん
はじめまして。これからもよろしくです。
うーん、やっぱ微妙ですよね。画像かなぁ。
>>Milli さん
ご報告ありがとうございます。
そうですか、かける言葉が思いつきません（笑
初めまして。いつも拝見させてもらっています。
10秒たっても、インジケータが隠れないのにはさすがにショックを受けましたが、Fx2.0、IE7で動作を確認しました。
インジケータが隠れてしまうと何も表示されないのは悲しいので、画像領域全体に表示されるギミックでも面白いかもしれませんね!
ちなみに、画像がロード完了されるまでに32秒掛かりましたorz...
はじめまして！面白いアイデアですね！
ただ読み込む画像よりも、この背景の方が重かったら意味ないですね笑
どっかでこのtipsを使ってみたいとおもいます。
>>kz さん
そうですね、たしかにインジケータが隠れてしまうとアレですよね。
せめて真ん中より下側に配置した方が良いかもしれませんね。
ちなみに、わざとロードが重くなるようにしてかなり重い画像を配置してたりします。>32秒
>>hiloki さん
ありがとうございます。
GIF だとそうそう重くはならないとは思いますが、確かに重かったら意味ないっすね :-)