■解説
サンプル1-1とサンプル1-2は、ロード待ちの間もページが表示されていきます。
その為スクロールされると表示中が見えなくなるので、この1-2はスクロールを追いかけて常に表示をします。
1-1との違いは、処理中表示がスクロールにあわせて動く事だけです。
アニメGIFをまず表示してドキュメントのロードが終わったら表示を隠します。
この方法の場合は、ロード中読み込まれたコンテンツがどんどん表示されます。
全てが読み終わる(ドキュメント・画像のロードなど)と、ロード中の表示が消えます。
このサンプル画面のソースはそのまま使えません。
配布ページのスクリプトを使ってください。
■使い方
HEAD内の最後(なるべくBODYに近い位置)にまたはBODYタグ直後にスクリプトを書きこむか、
外部ファイルとして読み込ませるようにしてください。
デフォルトではHTMLファイルと画像は同じディレクトにある事を前提にしています。
複数ページで使う場合などは、画像指定をhttpからのフルパスにすると便利です。
■ 使用してる 変数 など
グローバル関数名として LoadingMsg() を1個使用しています。
IDとして Loadouter 、 Loadinner の2個を使用しています。
■ グローバル関数名を使わない方法
■イベント
ウィンドウオンロードで表示中画像を消します。
ウィンドウスクロールで表示中画像を移動させています。
どちらもメソッドによるイベント付加なので、他のスクリプトのwindow.onloadと干渉しあいません。
ウィンドウスクロールは表示を消した後はイベントも消去しています。