| ポイント |
<![CDATA[
num ^= 1;
document.myIMG1.src = "type"+num+".jpg";
document.myIMG2.src = "type"+num+".jpg";
]]>
|
| 説 明 |
クリックしたら複数の画像を変更するにはaタグのhref属性にjavascript:実行関数名()を記述するかonclick="実行関数名()"と記述します。切り替える画像にはimgタグのname属性で名前を付けておきます。入れ替える画像は「document.画像名.src = 入れ替える画像のURL」として指定します。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>クリックすると複数画像を入れ替える（その２）</title>
<script language="JavaScript"><!--
num = 0;
function change()
{
num ^= 1;
document.myIMG1.src = "type"+num+".jpg";
document.myIMG2.src = "type"+num+".jpg";
}
// --></script>
</head>
<body>
<a href="javaScript:change()">
<img src="btn.gif" border="0">
</a>
<br>
<br>
<img src="type0.jpg" name="myIMG1"><br>
<img src="type0.jpg" name="myIMG2"><br>
</body>
</html>
]]>
|
| 補足説明 |
IEの場合はonclick="change()"のように直接IMGタグ内に記述しても動作します。 |
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
クリックすると複数画像を入れ替える（その２）