イメージマップ内のロールオーバーで切替後の画像のURL設定について。
イメージマップ内のロールオーバーで切替後の画像のURL設定について。
下記のURLでは、3枚の画像を用意し、tab1,tab2,tab3,と三つのタブの場所にそれぞれイメージマップを利用してロールオーバー効果を持たせ、tabにカーソルが乗ったとき3枚の画像が切り替わるようになっています。
http://sky.geocities.jp/make_it_move/index.html
そこで、皆さんにお聞きしたいのは、切り替わった画像それぞれに異なったリンクを指定する方法です。
ソースは
<SCRIPT type="text/javascript" >
function imgHover(path){
var target=document.getElementById('AreaMap');
var imagePath='./img/'+path;
target.src=imagePath;
}
</SCRIPT>
<body>
<img src="img/image1.jpg" id="AreaMap" alt="地図" width="825" height="300" usemap="#imagemap" border="0" />
<map name="imagemap" id="imagemap">
<area shape="rect" coords="554,16,811,105" href="ttp://www.yahoo.co.jp/" alt="" onmouseover="imgHover('image1.jpg')" >
<area shape="rect" coords="556,104,811,196" href="ttp://www.i-mezzo.net/" alt="" onmouseover="imgHover('image2.jpg')">
<area shape="rect" coords="556,195,812,287" href="ttp://www.kotaro269.com/" alt="" onmouseover="imgHover('image3.jpg')">
</map>
です。
area shape部分にはurlを指定出来るのですが、切り替わった画像の image1,image2,image3部分にも、tab部分と同じurlを指定して上げるには、どのようにすればいいのでしょうか?
宜しくお願い致します。