![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
小さい画像をクリックで、
大きな画像を小窓で見れるようにしたいのですが、
大きな画像のサイズが全部バラバラなのです。
(画像は合計8コあります)
通常は下記URLで小窓を出しているのですが、
画像のサイズがバラバラの場合、
8コのJavaScriptを書き込まなければいけないのでしょうか?
もし他に方法がありましたら、教えて下さい。
http://oshiete1.goo.ne.jp/kotaeru.php3?q=568520
説明が分かりづらくて申し訳ありませんが、
宜しくお願い致します。
![](http://oshiete.xgoo.jp/images/v2/common/profile/M/noimageicon_setting_02.png?e8efa67)
No.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>
このような形に直せば、関数を呼び出す側で開く小窓のサイズを指定・制御できます。
こんな感じではいかがでしょうか?
前回も今回も、大変分かりやすく、詳しく教えていただき、ありがとうございました。
大変感謝しております。
再度質問をするかとも思いますが、
また宜しくお願い致します。
この方法で、一度やってみます。
ありがとうございました。
No.1
- 回答日時:
>画像のサイズがバラバラの場合、
>8コのJavaScriptを書き込まなければいけないのでしょうか?
そんなことはありません。一番簡単なのは、画像サイズを統一するか、
現在のウィンドウサイズに収まる形に画像サイズを変更すること。
難しくなるとそのJavaScriptを修正することになるのですが、
その回答によると二つの方法が示されていますが、どちらを利用しているのでしょうか。
早速のご回答ありがとうございます。
画像サイズを変更するのが一番早いのですが、
サイズ変更をする事によって画像に乱れが
生じてしまう為に、変更が出来ないのです。
補足にも書かせていたたきます。
ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- デジタルカメラ 画像のJPGファイルの「大きさ」と「サイズ」の意味の違いをお教えください。 8 2022/09/18 14:50
- フリーソフト 倍率自動調整して全画面表示できるフリーの画像ビューアー 1 2023/08/24 10:55
- Excel(エクセル) エクセル、画像ファイル名の書かれたセル(複数個所)に画像を一括で表示させる方法 1 2023/04/19 00:19
- デジタルカメラ 画像ファイルのサイズを理解する方法についてお教えください。 3 2022/09/18 12:54
- Android(アンドロイド) Androidでツイキャスの2窓設定が分かりません。 ググれば説明は出てきますが 左が説明画像 右が 2 2022/04/03 19:56
- Google Maps iPhoneのGoogle検索窓を通常の大きさに 戻す方法を教えて頂けませんか?(切実) 日本全国の 2 2022/10/02 02:08
- その他(クラウドサービス・オンラインストレージ) firestorage_androidスマホでダウンロードできない 1 2022/10/25 08:18
- その他(AV機器・カメラ) 【大至急】写真加工に強い方、お願いします。 現在、自作のブックカバーをプリンパさんに依頼しています。 2 2023/06/07 21:30
- ホームページ作成・プログラミング グリッドレイアウトHTMLとCSS 1 2023/02/22 02:36
- Photoshop(フォトショップ) 【大至急】写真加工に強い方、お願いします。 現在、自作のブックカバーをプリンパさんに依頼しています。 6 2023/06/10 11:51
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Gifアニメ、最後のコマに行った...
-
スライダーを実装した場合、ペ...
-
複数の画像を先に読み込ませ表...
-
iframeからcolorboxの呼び出し
-
WEBページ立ち上げ時に1回のみ...
-
残像を残しながら別の画像に切...
-
表と裏がある1枚の画像を回転す...
-
透過pngの透明部分以外をクリッ...
-
始めに読み込む画像を固定して...
-
小窓について教えて下さい。
-
JavaScriptとチェックボックス...
-
MAX関数を使ってからLEFT JOIN...
-
画像の表示位置
-
ポップアップのソースの書き方...
-
JimdoでWebアイコンフォントの...
-
背景色を透明化
-
デフォルト非表示にしたい。【t...
-
window.openで値の渡し方を教え...
-
jspでcssが読み込めない
-
日替わりで画像を変更したい
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
textareaに画像を表示したい
-
Javascriptで指定した日付と時...
-
javascriptで毎月替わる画像
-
画像をフォルダに入れれば表示...
-
画像の重なりの順序を代える方...
-
スワップイメージが上手く動作...
-
JavaScriptとチェックボックス...
-
透過pngの透明部分以外をクリッ...
-
Gifアニメ、最後のコマに行った...
-
bxsliderにて読み込み後に内容...
-
Javascript で共通の処理をどこ...
-
1枚の画像をクリックして複数の...
-
各フォルダから1枚ずつ画像をラ...
-
画像を切り替えランダム表示
-
画像削除機能を付けたい
-
マウス追従スクリプトについて
-
画像ランダム表示、しかしダブ...
-
<table>、もしくは<iframe>内で...
-
1枚の画像をクリックすると複数...
-
画像とテキストのセットをラン...
おすすめ情報