
ポップアップウィンドウを開く時に、ウィンドウのサイズを「ヨコ幅固定、タテ幅自動調整」のような形にできないものか……と思っています。HTMLの知識は素人に毛が生えた程度なのですが、色々検索して現在は以下のようになっています。
<a href="#"
onClick="window.open('sample.html','window1',
'width=380,height=,menubar=no,toolbar=no,
location=no,directories=no,
status=no,scrollbars=no,resizable=no')">
heightのところを指定していないのですが、ある一定の(最大の?)高さに固定されてしまいます。コンテンツは高さがそんなにないので、下の方にかなり余白がある感じです。コンテンツに応じて、高さを自動調整することはできますでしょうか?
どうぞ宜しくお願いいたします。
No.1ベストアンサー
- 回答日時:
もし、画像をひとつ表示するだけならば、
私のこれ↓
<html>
<head>
<title></title>
<script language="JavaScript">
<!--
var img_x=3;//横一列の表示数//
var img_max=9;//表示総数//
var img_name=["0","1","2","3","4","5","6","7","8","9"];
//画像名(altでも使用、拡張子はいらない。.jpgになっているので変えたければ自分で変える//
var img_com=["0","1","2","3","4","5","6","7","8","9"];
//画像に対するコメント//
function put(w,h,x,y){
var a="";
var ram;
var all=0;
for(var j=0;j<img_max/img_x;j++){
for(var i=0;i<img_x;i++){
ram=all+'a.jpg';
a+='<a href="javascript:info('+all+')"><img src="'+ram+'"'+' onmouseover="this.src='+'imgc('+all+')" onmouseout='+'"this.src='+'imgb('+all+')';
//マウスが乗っている間だけsrcが「番号」+.jpgに、普段は「番号」+a.jpg//
a+='" '+'alt="'+img_name[all]+'"'+' style="position:absolute; width:'+w+'; height:'+h+'; top:'+j*y+'; left:'+i*x+';"></a><br>';
all++;
}
}
wri(a);
}
function info(num){
var win=window.open("",img_name[num],"");
win.document.open();
win.document.write('<b>'+img_name[num]+'</b><br><img src="'+num+'.jpg" name="img"><br>コメント:<br><font size="-1">'+img_com[num]+'</font><br><a href="javascript:window.close()">close</a>');
win.window.resizeTo(win.document.img.width+300,win.document.img.height+300);
//開いたウィンドウを画像の横+300px、縦+300pxでリサイズ//
win.document.close();
}
function imgb(n2){
return n2+"a.jpg";
}
function imgc(n){
return n+".jpg";
}
function wri(str){
document.open();
document.write(str);
document.close();
}
put(50,50,60,60);
//サムネイルの画像のwidth,height,一段ごとの間隔x,y//
//-->
</script>
</head>
<body>
</body>
</html>
を使う。サンプルは参考URL(1)に置いといたので参照。
それ以外はそれぞれのコンテンツに適したサイズをJavaScriptで変数に入れておき、ポップアップ後にresizeToするといいと思います。
余談ですが、画像表示だけなら参考URL(2)が使えると思います。
参考URL:http://www.geocities.jp/ram0kb/js/maetaImg.html, …
ご回答をいただいていたことに気付かず、
大変失礼してしまいました。
(メールで回答をいただいたことを通知する設定に
しておいたと思ったのですが、受信できていなかったようです)
大変参考になるご回答ありがとうございました。
まだ完全には理解していないのですが、
これから試してみます。
ありがとうございました!!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ボタンをセル内一杯に表示させ...
-
jqueryの画像切り替え
-
クリッカブルマップがきかない!?
-
画像の横に文字をうまく配置で...
-
htmlのolやulなどlistにtitleや...
-
htmlの文字が縦書きになる
-
スクロール時サイドバーを左側...
-
widthやheightの数値に単位(px...
-
含む含まないという概念自体の...
-
【至急】cssのコーディングにつ...
-
角丸画像の背景色を透明にした...
-
html の divとtable の役割
-
Jquery アコーディオンメニュー...
-
CSSで背景画像をランダムに同画...
-
idの中のid指定
-
HTMLで語の先頭をそろえるには?
-
html5 2段組で行頭を揃える方法
-
HTMLでメニューをリストで書き...
-
スタイルシートで、id属性の中...
-
dlタグの中にdivは使える?
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ボタンをセル内一杯に表示させ...
-
リンクを知らせる手のマークが...
-
XML画像データををHTMLで簡単に...
-
inputタグでサーバにデータを送...
-
【HTML/CSS】ボタンの枠が伸び...
-
画像の横に文字をうまく配置で...
-
機種依存文字、m2(平方メート...
-
プルダウンの選択リストの中に...
-
htmlで画像を2個ずつ並べていき...
-
HTMLのIMAGEに。。
-
画像をクリックして元に戻すには
-
javaをつかってテキストと画像...
-
HTMLでボタンを横に2つ並べる方法
-
IE7だけに出る謎の空白(CSS)...
-
IEでの”a img”の枠線について
-
ワードプレス max-width100%が...
-
画像の一部を選択した時のみマ...
-
画像をクリックして同じページ...
-
cssヘッダー画像の下に配置した...
-
UDP通信を使うチャットプログラ...
おすすめ情報