締切済み

クリッカブルマップとインラインフレームを組み合わせたい

2005/08/14 18:20

こんにちは。自分でも検索してしらべたのですが、どうしてもわからないので、質問させていただきます。現在、ページを製作中なのですが、タイトルのとおり、クリッカブルマップ画像の上にインラインフレームを組み合わせる方法がわからず、困っています。透過したインラインフレームを、女の子の画像に重ねて表示してあります。この女の子の画像にメニューが書いてあるので、それをクリッカブルマップにして、インラインフレームにリンクを表示したいと思っています。画像の上にインラインフレームを重ねて表示するのには成功しましたが、クリッカブルマップのタグを書き加えると、画面が真っ白になってしまいます。クリッカブルとインラインを組み合わせたデザインのサイトは結構あるので参考にしようとしてみましたが今いちわからなくて・・・回答よろしくお願いします。

yuyu0525
お礼率0% (0/1)

HTML
回答数1
ありがとう数0

みんなの回答 （1）
専門家の回答

みんなの回答

N_A_O
ベストアンサー率66% (37/56)

2005/08/16 22:33 回答No.1

<html> <head> <title>Danseuse Chevelure Noire</title> <script SRC="inwin.js"></script> </script> </head> <body bgcolor=""> <img src="http://blancnoir.client.jp/top2.jpg" width="600" height="450" usemap="#img" border="0" style="position:absolute; top:50px; left:100px; z-index:1;"> <MAP name="img"> <AREA shape="circle" coords="460,350,75" href="javascript:cls()"> </MAP> <IMG src="http://blancnoir.client.jp/menu.jpg" usemap="#menu" border="0" style="position:absolute; top:440px; left:150px; z-index:1;"> <MAP name="menu"> <AREA shape="rect" coords="3,4,37,24" href="javascript:iwinOpen('http://blancnoir.client.jp/info.html')" onFocus="this.blur()"> <AREA shape="rect" coords="42,2,93,36" href="javascript:iwinOpen('http://www1.rocketbbs.com/619/dcndiary.html')" onFocus="this.blur()"> <AREA shape="rect" coords="96,4,131,26" href="javascript:iwinOpen('http://blancnoir.client.jp/box.html')" onFocus="this.blur()"> <AREA shape="rect" coords="132,5,174,31" href="javascript:iwinOpen('http://blancnoir.client.jp/warp.html')" onFocus="this.blur()"> </MAP> <div id="iWindow" style="position:absolute; top:100px; left:175px; visibility:hidden; z-index:1;"> <iframe src="http://www1.rocketbbs.com/619/dcndiary.html" border="0" frameborder="0" width="450" height="300" id="iHtml"> </iframe> </div> <iframe src="http://blancnoir.client.jp/_yai_nobita/top.html" width="95%" height="15" FRAMEBORDER="0" SCROLLING=no style="margin:30px 0 0 0;position:absolute; top:475px; left:px; z-index:1;"> </iframe> </body> </html> inwin.js　外部ファイルの内容 function iwinOpen(imgSrc){ var lgPhoto=document.getElementById('iHtml'); lgPhoto.src = imgSrc; var iWin=document.getElementById('iWindow'); iWin.style.visibility = 'visible'; } function cls(){ var iWin=document.getElementById('iWindow'); iWin.style.visibility = 'hidden'; //var lgPhoto=parent.document.getElementById('iHtml'); //lgPhoto.src = "../gif/clos1.gif"; } デザイン等で細部は調整して。