Javascriptで画像の先読み「プリロード」するときのメモ

2007/06/16

(11)

テーマ：ホームページ作成の悩み(545)

カテゴリ：PC&Web

JavaScriptポケットリファレンス改訂第4版

JavaScript完全マスター

「画像のプリロードってどうやってするんでしょう？」

いつも Dreamweaver で勝手に書いてくれちゃうので
ロールーバーもプリロードイメージも気にすることなくできちゃうわけですよ。

ソフト依存だと、ソフトが変わると勝手にほかのタグが入ってきちゃったりして
嫌だな～と、ずーっと思っていたんです。

ちょっと時間もあることだし、ロールオーバーしたついでに
画像のプリロードのさせ方をネットでサクサクと検索しました。

もっとも単純でわかりやすかったページがこれ。

画像のプリロード（先読み）

で、私が書いたコードが下のとおり。
とっても単純な書き方なので、もうちょっと改変したいと思っているの。
シンプルなのはいいんだけれどもね～

■Javascript

function PreLoad(obj,val) {
    var d = document;
   var img = obj;
   d.img = new Image();
   d.img.src = val;
}

■HTML

<body onload="PreLoad('img1','image/aaa1.gif');PreLoad('img2','image/bbb1.gif');>

これは、Javascript で、単に先読みしているだけだから
本当に先読みに成功しているのかどうかが、目に見えてわからないんです。

うーむ。困りました。

けど、先読みに成功しているならば、キャッシュされているはずなので
キャッシュファイルを確認すればいいですよね～
「インターネット一時ファイル」ってヤツですわ。

見方は簡単！
Internet Explorer の　「ツール」⇒「インターネットオプション」を開いて
「全般」タブの「インターネット一時ファイル」のところにある「設定」ボタンをポチッと押す。
そうすると、「ファイル表示」ボタンがあるから、それを押して中身を見るの。

結構たくさんのファイルがあるから、どれがどれやら見分けにくいので
テストをするときには、「インターネット一時ファイル」のところにある「すべて削除」で削除してから
ガンガンとテストしてみましたよ。

ちゃーんと、「aaa1.gif」と「bbb1.gif」が保存されていたので
先読み成功ってことを確認できました。

久しぶりに更新したわ（汗）
寒くなったと思ったら、今日はメチャメチャ暑いです。
室温ただいま３２度。超快晴！
口内炎も痛いし、暑いし、ダブルパンチです。
ここ数日、鼻の調子も悪いしね～
夏風邪ですか？嫌なんですけど（汗）

そんじゃ、また～

現在のWebスカウター値１８２。上がってるね

･････つづく

東京２３区中心・駅近ホテルズ｜散文誌・３６５

*Web標準2007年版目次*

お気に入りの記事を「いいね！」で応援しよう

最終更新日 2007/06/16　02:13:53 PM
コメント(11) | コメントを書く

[PC&Web] カテゴリの最新記事

Web標準にアプローチ 〔まいまいのお宿。〕

Javascriptで画像の先読み「プリロード」するときのメモ

Web標準にアプローチ　〔まいまいのお宿。〕