別窓を開くプログラムについて
- web制作において、サムネイルをクリックすると別窓が開き、画像を大きく表示させる方法について調べています。
- 別窓に表示させる画像のサイズによって余白が発生してしまう問題があります。
- 画像のサイズに合わせて別窓をピッタリと収めるプログラムを作りたいと考えています。
- ベストアンサー
別窓を開くプログラムについて
はじめまして。初めての投稿の者です。 今回、ご相談の件ですが、 現在、webを制作してて、サムネイル（画像）をクリックすると別窓が開いて画像を大きく表示させるという風に作っています。 <script language="javascript"> <!-- function open_window(spass){window.open(spass,"flow","scrollbars=1,resizable=0,width=1000,height=760,left=0,top=0")} --> </script> ～～～中略～～～ <body> <a href="javascript:open_window('ファイル名.html')"><img src="画像のファイル名" width="250" height="150" alt="---"></a> ～～～中略～～～ この方法の場合、大きく表示させる画像のサイズによっては別窓に表示させたとき、ウィンドウに余白ができてしまいます。 width=1000,height=760の部分を無くして、なお且つ別窓に表示させたときの画像の周辺に余白が無いように・・と、色々とjavascriptに関するサイトや講座を拝見して調べてみましたが希望のような事が有りませんでした。 また、<a href="javascript:open_window('ファイル名.html')">・・ の箇所を、 open_window('大きく表示する画像のファイル名.jpg')・・ としても、ダメでした。 何がしたいかと申し上げますと、（別窓：ウィンドウに）大きく表示させる画像の周辺に余白が発生させないよう、ピッタリと収めさせる別窓にしたいです。【マージンによる多少の余白は可】 ※画像（写真）サイズに合わせて別窓も、そのサイズに開くと言えばお分かりでしょうか？ 技術者の方・経験者の方からアドバイス等ご教授戴けたら・・と思いますので、宜しくお願いします。
- j13
- お礼率100% (4/4)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
見当違いかもしれないけど、開いた大きさに画像を合わせてみては？ 以下、呼び出されるファイルの中身です そうそう、呼び出す側のスクロールバーは消してもいいかもね <html> <body> <!-- saved from url=(0014)about:internet --> <img src="Sunset.jpg" style="position:absolute; top:0px;left:0px;" id="b"> <div style="position:absolute; top:0px;left:0px;"> 文字はここに適当に書いておくれ！<br>画像の名前は適当にかえて！ <br> </div> <script> window.onresize = i; window.onload =i; function i(){ o=document.getElementById('b'); o.style.width = document.body.clientWidth; o.style.height = document.body.clientHeight; } </script>
その他の回答 (1)
>No1（_pipi_さん）のプログラムを使ってみましたが、別窓に開かなかったです。 別窓に開く開かないは、ブラウザ側の設定では？ IE7であれば、「他のプログラムのリンクを開く方法」を新しいウインドウに！
お礼
はい。お忙しい中、アドバイスありがとうございました。
関連するQ&A
- 別窓で画像を表示する場合に余白が…
大量に画像を扱って居るのですが、タイトルをクリックすると、別窓でそれぞれの画像が開く様にしています。 サイズは2種類、800*600と1024*768のがあります。 それを↓下のようなscriptで行っていますが、どちらのサイズの窓(画像)も、画像の左と上に余白が少し出て、右と下が切れてしまいます。何処が間違っているのでしょうか？ どうすれば、窓のぎりぎり一杯に画像を表示する事ができるでしょうか？ どうか、教えて下さい。 ↓ <table width="80%"> <tr> <td> <a href="#" onClick="window.open('../xxx/yyy.jpg','','width=1024,height=768')">グラデーション<font size="1">1024x768</font></a> </td> </tr> <tr> <td> <a href="#" onClick="window.open('../xxx/zzz.jpg','','width=800,height=600')">グラデーション<font size="1">800x600</font></a> </td> </tr> </table> (xxx.yyy.zzzは仮の文字です)
- ベストアンサー
- JavaScript
- 別窓についての質問です。
別窓の開くJavaScriptは分かるのですが、 別窓を多く開く方法が分かりません (1)大きめの窓で開きたい (2)小さめの窓で開きたい (↑サイズ指定をして) という場合、別窓を共有(？)する形になってしまい、 (1)を開いたまま、(2)を開こうとすると、 (1)の大きさの窓なので、 (2)のページを開くと余白ができてしまいます。 <HEAD>～</HEAD>内に <SCRIPT language=JavaScript><!-- function subWin1(){ window.open("★★★","window2","resizable=no,menubar=no,directories=no,status=no,location=no,scrollbars=yes,toolbar=no,width=500,height=500,left=10,top=10"); } --> </SCRIPT> <BODY>～</BODY>内に <A href="javascript:subWin1();" style="text-decoration:none" style="color:black"> <FONT onmouseover='this.color="#FF0000";' onmouseout='this.color=""'> <b>掲示板</b> </FONT> </A> (1)・(2)共、この書き方をしているのですが… ご意見お待ちしています。
- ベストアンサー
- JavaScript
- 画像リンクを別ウインドウでサイズ指定で開くように
<a href="http大きいサイズの画像" onclick="javascript:window.open('1.html','win1','width=400,height=550');return false;"><IMG SRC="http小さいサイズの画像.jpg" width=60,height=60></a> 小さなサイズの画像をクリックすると、別ウインドウで大きな画像が開くタグを作りたいのですが、 その際に大きいサイズの画像を400×550サイズでぴったりと開くようにしたいのです。 上記のタグでは、別ウインドウでは開くのですがサイズは変わりません… Javascriptを使わないといけないのでしょうか？ その辺のことが全くわからないので どなたかわかりやすく添削してもらえないでしょうか。
- 締切済み
- その他（インターネット・Webサービス）
- 別窓リンクの問題点は？
画像リンクによる別窓表示で下記の一行のみのソースをリンクとして別窓表示しています。この方法でのデメリットはありますでしょうか？ -------------------------------------------------------------- <body> <a href="javascript:void window.open('test.html',null,'height=450,width=300,menubar=no,toolbar=no,scrollbars=no');"><img src="test.gif"></a> </body> -------------------------------------------------------------- サイト検索で見かける別窓表示のソース↓ <head> <script language="JavaScript"> function openWindow(i) { window.open("sample" + i + ".html","","width=700, height=600"); } </script> </head> <body> <a href="javascript:openWindow('1')">sample1.html</a><br /> </body> これとの比較したときの問題は？
- 締切済み
- JavaScript
- Javascriptを使わないで別窓
サイトの作成で、現在以下のjavascriptを使用したつくりになっているんですが、 function subWin1(){ window.open("top_ss.htm","lunanueva","resizable=no,menubar=no,directories=no,status=no,location=no,scrollbars=yes,toolbar=no,width=800,height=620");} ※ステータスバーとか消した別窓を出すjavascript Javascriptを使用せず、ステータスバーを消す別窓など、それに近いことを行うことはできないでしょうか。
- ベストアンサー
- HTML
- 別のウインドウを出す
HTMLにて、Aというファイル内でリンク指定したジャンプ先をB、更にBというファイル内でリンク指定したジャンプ先をCとしたとき、それぞれJavascriptのopen_windowを使って、それぞれ別のページをウインドウの大きさを変えて表示させるようにしたいのですが、A→Bはうまくいくのですが、B→Cをすると、BのページがCに変わる（同一ウインドウでジャンプされる）だけで、Cを表示したいウインドウが新規に出てきません。 因みに、 <a href="javascript:open_window('ファイル名',form,width=200,height=200,left=0,top=0,resizable=yes,scrollbars=yes)">ジャンプ先</a> としています。 どこを修正すればいいか解らないので教えて下さい。よろしくお願いします。
- ベストアンサー
- JavaScript
- 中央に、アドレスバー表示した別窓を表示
別窓を中央に開くため、 次のものを用意したのですが、その別窓にアドレスバーを表示させたいのです。 どこをどうしたらよいのでしょうか。 locationってのをどこかに書き込めば良いのかと思っていろいろやってみておりますが、うまくいきません。 ぜひご教授ください。 ↓現在、用意したもの <head> <SCRIPT language="javascript"> var win = null; function NewWindow(mypage,myname,w,h,scroll){ LeftPosition = (screen.width) ? (screen.width-w)/2 : 0; TopPosition = (screen.height) ? (screen.height-h)/2 : 0; settings = 'height='+h+',width='+w+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',resizable' win = window.open(mypage,myname,settings) } </SCRIPT> </head> <body> <a href="demo.html" onclick="NewWindow(this.href,'myname','450','375','no' );return false">[こちら]</A> </body>
- ベストアンサー
- JavaScript
- 別窓にスクロールをつけるやり方は？
XPでビルダーV8でＨＰを作成しています。 先程、別窓を開いて幅を指定したやり方を見て、これはいいと利用しようと思ったのですが <A href="#" onclick="window.open('info.html','_blank','width=500,height=700');">当サイトについて</A> これで出来たのですが、スクロールがないため 枠を指定しても入りきれないんです；； この別窓にスクロールをつける方法を教えてくださいｍ(．．)ｍペコ それが出来ればすっごく嬉しいんですが・・・ あと、もう一つ・・・ リンクをこの別窓の文章に作成すると、別窓の中で開いてしまうじゃないですか。 それってtargetで他に開くしか方法はないのでしょうか？ 元の所に開かせることは出来ないですよね？ わかりずらかったらごめんなさい。 宜しくお願い致します。
- ベストアンサー
- HTML
- 別窓を開くリンクでリンク元に画像を使用したいのですけども・・・
いつもお世話になります。 また、問題が発生致しました。 javaScriptで別窓を開くリンクでリンク元に画像を利用したいのですけども検索しても文字からのリンクしか見つからず画像からのリンクを教えて頂きたいのですが、よろしくご指導お願い致します。 <SCRIPT LANGUAGE="JavaScript"> <!--- function wopen1(){ window.open("http://www.yahoo.co.jp","yahoo", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,width=500,height=300") } //---> リンク元で画像を使いたいです。 <A HREF="javascript: wopen1()">ウィンドウ1</A> これをどのように書き換えれば画像からリンクできますでしょうか？ お手数かけますがお願いいたします。
- ベストアンサー
- JavaScript
- ブログ本文からサイズ指定の別窓リンクしたい
本文にリンクを貼り、クリックで別窓をサイズ指定で開くようにしたくて、下記のように書いてみたのですが、フルサイズで開いてしまいます。 どうしたらサイズを指定して開けるのでしょうか？ <h3>ヒューマン編</h3> <script language="JavaScript"> <!-- function openWindow() {window.open("","movie1",'width=420,height=330');} //--> </script> <a href="http://otsdestiny.xxxxxxxx.jp/movie1.html" onClick=openWindow() target="movie1"><img src="http://image.blog.livedoor.jp/ots_destiny/imgs/a/4/a4b74f28.gif?blog_id=1219642" border="0"></a> <h3>ホラー編</h3> <script language="JavaScript"> <!-- function openWindow() {window.open("","movie1",'width=420,height=330');} //--> </script> <a href="http://otsdestiny.xxxxxxxx.jp/movie2.html" onClick=openWindow() target="movie1"><img src="http://image.blog.livedoor.jp/ots_destiny/imgs/6/c/6c8705cd.gif?blog_id=1219642" border="0"></a>
- ベストアンサー
- ブログ
お礼
ご回答ありがとうございました。
補足
ひとつ、忘れていました。 呼び出される側のファイルは以下の通りです。 ～～～中略～～～ <body onLoad="focus()"> <img src="A.jpg" border="0" width="900" height="640" alt="***"> <FORM><input type="button" value="閉じる" onClick="window.close()"></FORM> ～～～中略～～～ No1（_pipi_さん）のプログラムを使ってみましたが、別窓に開かなかったです。 ＞開いた大きさに画像を合わせてみては？ 画像は、大きさの違うものが有りますので（縦サイズ・比率の関係）、すべて揃えることが出来ません。