- ベストアンサー
Javascript ポップアップウィンドウについて
初歩的なことだとは思いますが、教えてください。 ポップアップウィンドウで画像を表示するためのリンクを以下のように記述して使っていますが、 ポップアップウィンドウ内に余白が出ます。（ウインドウ枠と画像の間） ウインドウの左上（0,0）の位置に画像を持ってくるにはどうしたらいいのでしょうか。 調べたものをいくつか試してみましたが、どれもうまくいきませんでした。 よろしくお願いします。 -------------------- ■<head>内 <script type="text/javascript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> ■<body>内 <a href="img/test.gif"><img alt="" src="～.gif" onclick="MM_openBrWindow('img/test.gif','test','scrollbars=yes,width=950,height=400')" /> </a> ------------------------- もしくは、 ■<head>内 <script type="text/javascript"> <!-- function WindowOpen_01(){ window.open('test.gif','test','scrollbars=yes,width=1150,height=350,left=0,top=0'); } //--> </script> ■<body>内 <a href="javascript:WindowOpen_01()"><img src="img/table_off.gif" alt="" width="320" height="55" class="mar_t_10" onmouseover="this.src='img/table_ban_on.gif'" onmouseout="this.src='img/table_off.gif'" /></a>
- mint-time
- お礼率53% (7/13)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
bodyのtopmargin等を０に指定してやらないといけないみたいですね。 function WindowOpen_01(){ var newdoc=window.open('','','scrollbars=yes'); newdoc.document.open(); newdoc.document.write('<html>'); newdoc.document.write('<body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0>'); newdoc.document.write('<img src="test.gif">'); newdoc.document.write('</body>'); newdoc.document.write('</html>'); newdoc.document.close(); } http://www.htmlcodetutorial.com/document/_BODY_TOPMARGIN.html
その他の回答 (1)
- TTT0918
- ベストアンサー率42% (3/7)
＃１に加え、スタイルシートを使うと楽です。 ■<head>内 function WindowOpen_01(){ var newdoc=window.open('','','scrollbars=yes'); newdoc.document.open(); newdoc.document.write('<html>'); newdoc.document.write('<body style="margin: 0px;">'); //ここが変わった newdoc.document.write('<img src="（ここにポップアップウィンドウに表示したい画像URLを入力）">'); newdoc.document.write('</body>'); newdoc.document.write('</html>'); newdoc.document.close(); } ■<body>内 <a href="javascript:WindowOpen_01()"><img src="（ここに元ウィンドウに表示させる画像URLを入力）" alt="（解説）" width="（横幅）" height="（縦長さ）" class="（クラス名）" onmouseover="（ここにポインタを載せたときに表示させる画像URLを入力）" onmouseout="（ここにポインタを画像から離したときに表示させる画像URLを入力）" /></a> ちなみに画像を変えるなら・・・ ■<head>内 function MM_openBrWindow(theURL,wdth,hght){ var newdoc=window.open('','','width=wdth,height=hght'); newdoc.document.open(); newdoc.document.write('<html>'); newdoc.document.write('<body style="margin: 0px;">'); newdoc.document.write('<img src="'+theURL+'">'); newdoc.document.write('</body>'); newdoc.document.write('</html>'); newdoc.document.close(); } ■<body>内 <a href="（リンク先(?)）" onclick="MM_openBrWindow('（ここに新ウィンドウに表示させる画像URLを入力',（画像横幅を入力）,（画像縦長さ)"><img alt="（解説）" src="（親ウィンドウに表示させる画像URLを入力）" /> </a> です。時間が無いので動作確認はしておりません。
お礼
スタイルシートでもOKなんですね。 たくさんの情報をありがとうございます。 とても参考になりました。
お礼
ありがとうございます。 とても分かりやすかったです。 無事、表示できました！