件名の通り、JSで入替えた画像をクリッカブルマップにしたいのです。一応画像の入替えはコントロールできるようになったのですが、入替え後のイメージを<MAP>制御したいのですが・・・方法がわからない・・・どうか教えて下さい。

ソース(抜粋)
<SCRIPT Language="JavaScript">
<!--
function ImgSwap(imgName, imgSrc){
var appVer=parseInt(navigator.appVersion);
var isNC=(document.layers && (appVer >= 4));
var isIE=(document.all && (appVer >= 4));
if (isNC || isIE){
if (document.images){
var img = document.images[imgName];
if (!img) img = ImgFind(document, imgName);
if (img) img.src = imgSrc;
}
}
}

//--></SCRIPT>


<TR><TD align="center" valign="top" height="165" background="../img/tv-frame.gif">
<IMG src="../img/off.gif" name="TV" border="0">
</TD></TR>
<TR><TD align="center" valign="top">
<FORM><INPUT type="button" value="Top" name="top" onclick="ImgSwap('TV', '../img/top.gif')"><INPUT type="button" value="40's" name="40's" onclick="ImgSwap('TV', '../img/40s.gif')"><INPUT type="button" value="50's" name="50's" onclick="ImgSwap('TV', '../img/40s.gif')"></FORM>
</TD></TR>

この40sないし50sというGIFに<MAP>制御を施したいのです・・・御指導宜しく御願いします。

このQ&Aに関連する最新のQ&A

A 回答 (1件)

具体的なイメージが湧かないので、とりあえず同じ位置に別画像を置いて、クリックするとクリッカブルマップと画像を入れ替えるサンプルを書きます。


----
<HTML>
<HEAD>
<MEAT http-equiv="Content-script-type" content="text/javascript">

<SCRIPT type="text/javascript">
var MAPMAX=2; //切替マップの上限
function chgMAP(num)
{
// 全部のクリッカブルマップ画像を非表示にする
for(i=1; i<=MAPMAX; i++) {
document.images["MP"+i].style.visibility = "hidden";
}
// 指定のクリッカブルマップ画像を表示にする
document.images["MP"+num].style.visibility = "visible";
}
</SCRIPT>
</HEAD>
<BODY>
</BODY>
<IMG SRC="img1.jpg" name="MP1" usemap="#MPT1" style="position:absolute;top:Opx;left:Opx;visibility:visible">
<IMG SRC="img2.jpg" name="MP2" usemap="#MPT2" style="position:absolute;top:Opx;left:Opx;visibility:hidden">
<MAP name="MPT1">
<area shape="rect" coords="0,0,50,100" href="javascript:chgMAP(2)">
</MAP>
<MAP name="MPT2">
<area shape="rect" coords="50,0,100,100" href="javascript:chgMAP(1)">
</MAP>
</HTML>
    • good
    • 0
この回答へのお礼

説明があまり上手くできなかったので混乱させてしまったようで・・・すみませんでしたm(__)m
なるほど、この様な手法を用いるのですなφ(..)メモメモ
有難う御座います。さっそくこのやり方でやってみます

お礼日時:2002/02/08 11:30

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


人気Q&Aランキング