ポインタを合わせると画像が変わる



トップへ

<A>タグ内に書きますがリンクの必要はありません。


1) 次のスクリプト1を<HEAD>〜</HEAD>内に記述

<!--スクリプト1-->
<script language="javascript">
<!--
if(navigator.appVersion.charAt(0) >= 3) {
        var img = new Array();
        img[0] = new Image();  img[0].src = "j_maru1.gif"; //画像パスを入力
        img[1] = new Image();  img[1].src = "j_maru2.gif";
/*以下、
  img[2] = new Image(); img[2].src = "画像URL";
  img[3] = new Image(); img[3].src = "画像URL";
という風に番号の数字(img[数字])を一つずつ増やすことで
いくつでも画像を読み込んでおく事が出来ます。*/
}
function change_image(nam,num) {
        if(navigator.appVersion.charAt(0) >= 3) {
                document.images[nam].src = img[num].src;
        }
}
//-->
</script>
<!--ここまで-->



2) 次のようにタグを挿入する

<A HREF="java.htm" onMouseOver="change_image('img1',1)" onMouseOut="change_image('img1',0)">
<IMG SRC="j_maru1.gif" ALT="" ALIGN=BOTTOM WIDTH=50 HEIGHT=50 BORDER=0 NAME="img1">
</A>

　img1というのはひとつの<A>でワンセットですからいくつも指定する場合は同じ画像を使うとしても変えなくてはなりません。

<A HREF="****.htm" onMouseOver="change_image('img2',1)" onMouseOut="change_image('img2',0)">
<IMG SRC="j_maru1.gif" ALT="" ALIGN=BOTTOM WIDTH=50 HEIGHT=50 BORDER=0 NAME="img2">
</A>


□BACK