- ベストアンサー
小窓について教えて下さい。
小さい画像をクリックで、 大きな画像を小窓で見れるようにしたいのですが、 大きな画像のサイズが全部バラバラなのです。 （画像は合計８コあります） 通常は下記ＵＲＬで小窓を出しているのですが、 画像のサイズがバラバラの場合、 ８コのJavaScriptを書き込まなければいけないのでしょうか？ もし他に方法がありましたら、教えて下さい。 http://oshiete1.goo.ne.jp/kotaeru.php3?q=568520 説明が分かりづらくて申し訳ありませんが、 宜しくお願い致します。
- keikaiga
- お礼率88% (105/119)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
おはようございます。 スクリプトを個別に8個用意する必要はありません。 関数を工夫してやれば、リーズナブルに記述できます。 具体的には、関数に渡す引数を追加して、関数にウィンドウサイズの指定を引き渡してやればよいと思います。 以前提示したスクリプトの前者の方を改造するのであれば、head内は <script type="text/javascript"><!-- function subwin(imgsrc,imgalt,xx,yy){ sub1=window.open("","_blank","width="+xx+",height="+yy+",resizable=1"); sub1.document.open(); sub1.document.write("<html><head><title>"+imgalt+"</title></head>"); sub1.document.write("<body style='margin: 0;'>") sub1.document.write("<img src='"+imgsrc+"' alt='"+imgalt+"' width='"+xx+"' height='"+yy+"'>"); sub1.document.write("</body></html>"); sub1.document.close(); } //--></script> 関数の呼び出し部は、 <a href="#" onClick="subwin('画像ファイルのURL','画像ファイルの説明',小窓の横幅,小窓の縦幅); return false;"><img src="p_1.jpg" border="0" width="70" height="48"></a> とすればよいでしょう。 上記のケースでは、内容として表示される画像も小窓のウィンドウサイズいっぱいになるように指定してあります。 画像を表示するHTMLファイルを別に用意してあるケースで、小窓を指定したサイズで開きたいのであれば(前質問の後者の例を改造するなら)、 <script type="text/javascript"><!-- function subwin(file,xx,yy){ window.open(file,"_blank","width="+xx+",height="+yy+",resizable=1"); } //--></script> 上記をhead内に、関数の呼び出し部は <a href="#" onClick="subwin('読み出すHTMLファイルのURL',小窓の横幅,小窓の縦幅); return false;"><img src="p_1.jpg" border="0" width="70" height="48"></a> このような形に直せば、関数を呼び出す側で開く小窓のサイズを指定・制御できます。 こんな感じではいかがでしょうか?
その他の回答 (1)
- the845t
- ベストアンサー率33% (246/743)
＞画像のサイズがバラバラの場合、 ＞８コのJavaScriptを書き込まなければいけないのでしょうか？ そんなことはありません。一番簡単なのは、画像サイズを統一するか、 現在のウィンドウサイズに収まる形に画像サイズを変更すること。 難しくなるとそのJavaScriptを修正することになるのですが、 その回答によると二つの方法が示されていますが、どちらを利用しているのでしょうか。
お礼
早速のご回答ありがとうございます。 画像サイズを変更するのが一番早いのですが、 サイズ変更をする事によって画像に乱れが 生じてしまう為に、変更が出来ないのです。 補足にも書かせていたたきます。 ありがとうございました。
補足
二つの質問のうち、 最初の回答にあった方を利用したいのです。 ｈｔｍｌではなく、ｊｐｇのみの表示です。 宜しくお願い致します。
お礼
前回も今回も、大変分かりやすく、詳しく教えていただき、ありがとうございました。 大変感謝しております。 再度質問をするかとも思いますが、 また宜しくお願い致します。 この方法で、一度やってみます。 ありがとうございました。
補足
またまた出来ました！！ ありがとうございました♪