オンマウスで画像が切り替わった先の画像にリンク

質問

オンマウスで画像が切り替わった先の画像に別ページのリンクを新窓で立ち上げたいのですが、方法が分かりません。
参考までに該当ページのURLを落としていきます。
http://rs-produce.net/html/deco-goods/order/or_004.html

回答No.2

fujillin

えーっとですね・・・
よくわかんないけど、拡大画像を操作したときに別ウィンドウで新しいURLを表示したいということで、いいんでしょうか？

MM_swapImageの中身が不明で、どんな制御になっているかわからないので、考え方のみを記します。
（1）拡大表示のブロックの画像に（縮小表示と同じように）イベント設定を
　　しておく
（2）MM_swapImage内の処理で、画像のsrc指定（とCSSの制御をしてる
　　かも）の他に、上記のイベントの処理（新ウィンドウを開く）を付加える
・・で、可能かと。

具体的には（と言っても、スクリプトが不明なので具体的にならないけど）
（0）現在MM_swapImageの引数が
　　（PHOTO、（不明）、画像URL）　となっていますが、これに「新たに開
　　くURL」を追加する　（どの画像でもURLが固定の場合は引数は不要）
　　　（サイズやターゲットも個別指定するならそれも追加）
（1）拡大部分の<img>タグにイベントを設定
　　<img id="PHOTO" src="" onClick="">
(2)MM_swapImageに処理を追加
　　getElementByIdなどでPHOTOを得ているはずなので、それをEと
　すれば、その属性設定で
　E.onclick=function(){window.open(url,'_blank','width=400,height=400');}
　などしておく。（urlは（0）で追加したURL引数）

*）なお、テスト上でもオンマウスはうるさいし、No1様の意見にも
　賛成なので、（↑）の例は全てオンクリックにしてあります。
　ターゲット指定やサイズ等も修正してください。

お礼

お礼が遅くなってしまい、申し訳ございません。
アドバイスの通り、該当箇所を変更させていただきました。
丁寧・ご親切なご対応、本当にありがとうございます。

回答No.1

yambejp

オンマウスするたびに新窓をたちあげるという意味ですか？
もしそうであれば仕様としては最悪の部類の処理なのでやめた方が
いいです。
そうでないなら、仕様をもうすこしきちんと説明してください

補足

説明不足で申し訳ございません。
縮小画像をオンクリックでターゲット先に拡大画像を表示させているのですが、
その縮小画像をクリックして拡大画像が表示された際に、
オンクリックでそれぞれの該当ページに新窓を立ち上げたいのです。

ちなみに、現在の記述内容は下記の通りです（一部抜粋です）。
※尚、JavaScriptとCSSファイルは外部ファイルです。

--拡大画像表示部分--（ここに縮小画像が表示されます）
<div class="imageblock">
<img src="../../../../image/deco-goods/order/or_004-01.jpg" name="PHOTO" width="300" height="300" id="PHOTO" alt="オリジナルオーダーデコ">
</div>

--縮小画像表示部分--（ここの画像がオンクリックで拡大画像表示部分に表示されます）
<div class="imageblock6">
<a href="JavaScript:;" onclick="MM_swapImage('PHOTO','','../../../../image/deco-goods/order/or_004-01.jpg',1)"><img src="../../../../image/deco-goods/order/or_004-01.jpg" alt="" name="PHOTO1" width="80" height="60" border="0" id="PHOTO1" /></a>
</div>
<div class="imageblock6">
<a href="JavaScript:;" onclick="MM_swapImage('PHOTO','','../../../../image/deco-goods/order/or_004-02.jpg',1)"><img src="../../../../image/deco-goods/order/or_004-02.jpg" alt="" name="PHOTO2" width="80" height="60" border="0" id="PHOTO2" /></a>
</div>
<div class="imageblock6">
<a href="JavaScript:;" onclick="MM_swapImage('PHOTO','','../../../../image/deco-goods/order/or_004-03.jpg',1)"><img src="../../../../image/deco-goods/order/or_004-03.jpg" alt="" name="PHOTO3" width="80" height="60" border="0" id="PHOTO3" /></a>
</div>
<div class="imageblock6">
<a href="JavaScript:;" onclick="MM_swapImage('PHOTO','','../../../../image/deco-goods/order/or_004-04.jpg',1)"><img src="../../../../image/deco-goods/order/or_004-04.jpg" alt="" name="PHOTO4" width="80" height="60" border="0" id="PHOTO4" /></a>
</div>
<div class="imageblock6">
<a href="JavaScript:;" onclick="MM_swapImage('PHOTO','','../../../../image/deco-goods/order/or_004-05.jpg',1)"><img src="../../../../image/deco-goods/order/or_004-05.jpg" alt="" name="PHOTO5" width="80" height="60" border="0" id="PHOTO5" /></a>
</div>
<div class="imageblock6">
<a href="JavaScript:;" onclick="MM_swapImage('PHOTO','','../../../../image/deco-goods/order/or_004-06.jpg',1)"><img src="../../../../image/deco-goods/order/or_004-06.jpg" alt="" name="PHOTO6" width="80" height="60" border="0" id="PHOTO6" /></a>
</div>