2013年10月23日(水) 23時21分09秒 [仕事]

スクリプトを一切使わずに、ローディング画像を表示する方法

ウェブページ上に掲載している画像の読み込みが完了するまでの間、画像が表示される領域に、「ローディング画像」を表示させる方法の解説を、All Aboutで公開しました。

■『画像の読込完了まで、ローディング画像を表示する方法』（＠All About ホームページ作成）

ローディング画像ってのは、「今、なんか処理をやってるよ」という意味を示す、くるくる回転するアレのことです。(^_^;;; まあ、回転するとは限らず、昔からある「プログレスバー」のような形でもローディング画像と言えますけども。

今回解説した方法の特長は、スクリプトが一切不要という点です。
CSSだけを使って簡単に表示できます。
ローディング画像は、アニメーションGIF画像として別途必要ですが、それも望みの配色・サイズ・形で簡単に作れる（ウェブ上の）サービスを紹介しています。

それほど必要性のあるテクニックではありませんが、簡単に実現できるので、使ってみるとちょっと面白いかも知れません。

※スクリプトを使うわけではないので、「どれくらい読み込めているか」を割合で示したりはできません。単に、「ここに画像がそのうち読み込まれるよ」ということを示せるだけです。^^;