ここでは、画像を先に読み込み、オンマウスなどで画像を変更する時に、すばやく表示させようと思います。
サンプルでは、68KBの画像を一瞬で変更できるように仕掛けていますが、画像が読み込むまでの間に画像を変更させたら意味がありませんので、しばらくお待ちください。
その間に、タグの説明をしておきます。基本的なタグは、下記のタグです。記入する場所は、<HEAD>〜</HEAD>の間に記入してください。
<script language="JavaScript">
<!--
new Image().src = "../../s/u/bana.gif";
// -->
</script>
これで、"../../s/u/bana.gif"の画像が、表示される前に読み込まれて、一瞬にして表示されます。
また、複数の画像を一瞬で表示されるようにしたい場合は、下記ように増やしてください。
<script language="JavaScript">
<!--
new Image().src = "../../s/u/bana.gif";
new Image().src = "../../s/u/bana2.gif";
new Image().src = "../../s/u/bana1.gif";
// -->
</script>
画像変更(何もしていない状態)
画像変更(先読み込み済み)