読み込み中画面にアニメーションを入れてみた
そもそも、ローディング画面って何...? と疑問に思う方に簡単な説明。
サイトにアクセスした時に、そのページが表示される前に、何かしらのアニメーションが表示される場合があります。
← これです！
導入にあたって今回はFlat Preloadersさんのサイトで公開されてるアニメーションを導入してみました。
pixelbuddha.net
スタイルシートは、はにわまんさんの「HPcode」『ページ読み込み中のローディング画面を表示するJavaScript』に記載されてるコードを参考にして設定してみました。
haniwaman.com
はてなブログの場合は、ユーザー設定 > カスタマイズ > デザイン > ベッター > ベッター下にHTMLコードを入力。
ユーザー設定 > カスタマイズ > デザイン > CSS にCSSコード。
JavaScriptは、設定 > 詳細設定 > 検索エンジン最適化の中にあるheadに要素を追加という項目に入力していきます。
ローディング画面に使用される画像は各自用意してくださいね。
↑ 私は青い●が横にスライドしていく画像を使ってみました。
