ウィンドウの大きさ&中央へ配置

このQ&Aのポイント
  • 質問1: ウィンドウの大きさをスクリーンの大きさに合わせる方法について
  • 質問2: ウィンドウを画面の中央に配置する方法について
回答を見る
  • ベストアンサー

ウィンドウの大きさ&中央へ配置

ちょっと、うまくできないので質問させていただきます。 2つ質問させていただきます。 1) 現在、javascriptを使用して、新しいウィンドウを表示させています。 その際に、ウィンドウの大きさを指定しているのですが、そのウィンドウの 大きさを、スクリーンの大きさによって、変えたいのです。 スクリーンの大きさと言っているのは、画像解像度によって画面の中に 収まる大きさが違いますよね? なので、どんな人でも、一画面の中にページを表示させたいのです。 現在こんな感じで書いているのですが、うまくいきません。 var win_width= screen.width*0.9; //画面の横幅 var win_height = screen.height*0.9; //画面の縦幅 newwin = window.open("aaa.html", "win", "width=win_width,height=win_height,menubar=no,location=no,status=no"); 上記は、画面の大きさの9割で一画面で表示させたいと思っています。 何か、間違いやアドバイスがあればよろしくお願いします。 2) また、その新しく表示させたウィンドウを画面の中央に表示させたいと 思っています。 newwin.moveTo(0,0); 上記で、左上に配置は、できるのですが、中央となると人によって違うので、 どのような考え方をしたらよろしいでしょうか? アドバイスよろしくお願いします。

  • mkim
  • お礼率72% (161/221)

質問者が選んだベストアンサー

  • ベストアンサー
  • inoue64
  • ベストアンサー率29% (334/1115)
回答No.2

(2) ---- ソース開始 ---- <script> var win_width= screen.width*0.9; //画面の横幅 var win_height = screen.height*0.9; //画面の縦幅 scr_yohaku_width = (screen.width - win_width)/2; //左右の余白 scr_yohaku_height = (screen.height - win_height)/2; //上下の余白 newwin = window.open("about:blank", "win", "width="+win_width+",height="+win_height+",menubar=no,location=no,status=no"); newwin.moveTo(scr_yohaku_width,scr_yohaku_height); </script> ---- おわり ---- (タイトルバーやウインドウの枠関係は無視することとします。)

mkim
質問者

お礼

ここまで、丁寧に書いていただいて、ありがとうございます。 ほとんど、そのまま使わせていただきました。 inoue64さんだけだったので、こっちだけを 良回答にさせていただきます。 ほんとに、ありがとうございました。

その他の回答 (1)

  • inoue64
  • ベストアンサー率29% (334/1115)
回答No.1

(1) 誤:newwin = window.open("aaa.html", "win", "width=win_width,height=win_height,menubar=no,location=no,status=no"); win_width と win_height は変数なので、 正:newwin = window.open("about:blank", "win", "width="+win_width+",height="+win_height+",menubar=no,location=no,status=no"); とする必要があります。

参考URL:
http://tohoho.wakusei.ne.jp/js/
mkim
質問者

お礼

ありがとうございます。 基本を知らないのに、サンプルとか見ていじくるから こういう事になりました^^;; ちゃんと基本も勉強いたします。 ありがとうございました。

関連するQ&A

  • ポップアップウィンドウを画面中央に配置+複数リンクを同じウインドウに表示させたい

    過去にあった複数のイベント等の写真をスライドショーで紹介するページを作成中です。 ひとつのページ上に複数リンクがあって、それぞれクリックするとポップアプウィンドウが画面中央で開くようにすることはできました。(下記参照) <script type="text/javascript"> <!-- function win(url,windowname,width,height) { var features="location=no, menubar=no, status=yes, scrollbars=yes, resizable=yes, toolbar=no"; if (width) { if (window.screen.width > width) features+=", left="+(window.screen.width-width)/2; else width=window.screen.width; features+=", width="+width; } if (height) { if (window.screen.height > height) features+=", top="+(window.screen.height-height)/2; else height=window.screen.height; features+=", height="+height; } window.open(url,windowname,features); } // --></script> body内 <a href="link_page.htm"onclick="win(this.href,null,600,430); return false;"><img src="image.gif" width="123" height="18" /></a></td> ただ複数あるリンクをクリックすると、ポップアップウィンドウも次々増えてしまうのを、常にひとつのウインドウ上に表示させることができません。 どうぞご指南よろしくお願いします!

  • 指定のウインドウを手前に(続き)

    さきほどの続きです。 すみません。 ネスケ4.7では思ったとおりに動くのですが、 IE5だと focus() がうまく動きません。 function OpenWin(page){ var src = page + ".html"; w=window.open((src),'NewWin','toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,width=300,height=600'); w.focus(); } としています。 何か書き方おかしいでしょうか。 よろしくお願いします。

  • ブラウザーの左下に、「java scriptエラー」とでてしまいます。

    自分のHPにjavascriptをつかっているのですが、ブラウザ(IE5.5)でみると、画面左下に、「java scriptエラー」とでてしまいます。でも、そのjavascriptは実際にちゃんと機能してくれます。「java scriptエラー」と出ないようにしたいのですが、どうすればよいのでしょうか?HPで使っているjavascriptは、以下の通りなんですが、何か間違っていますでしょうか? <html> <head> <title>test<title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <SCRIPT language="javascript"> function newwin1() { sub = window.open("test.html","window1","toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,width=610,height=480"); x = (screen.width - 610) / 2; y = (screen.height - 480) / 2; sub.moveTo(x,y); } </SCRIPT> <!--ここから外部javascriptの指定--> <script src="newwin1.js"></script> <!--ここまで外部javascriptの指定--> </head>

  • ブラウザサイズをフルサイズで表示させる方法

    ブラウザにタイトルバーとスクロールバーとスタートバー以外を表示しないページを作成したいのですが、 XPはOKで、WIN98でうまくいきませんでした。リンク先をクリックすると別ウィンドウが立ち上がる仕組みです。画面サイズに合わせて変わるようなのですが、WIN98では、スクロールバーが途中で切れてしまい、 一番下まで、綺麗に表示できませんでした。これ以外の方法でもかまいませんので、どなたかご伝授いただければと思います。 function wopen(url){ if(screen.width <= 640){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=640,height=480,left=0,top=0") }elseif(screen.width <= 800){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=800,height=600,left=0,top=0") }else if(screen.width <= 1024){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1024,height=768,left=0,top=0") }else if(screen.width <= 1152){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1152,height=864,left=0,top=0") }else if(screen.width <= 1280){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1280,height=1024,left=0,top=0") }else{ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1600,height=1240,left=0,top=0") } return; } : <A href="javascript:wopen('/index.html')">

  • 以前画面100%表示できる方法を教えてもらったものですが、・・・

    以前画面100%表示できる方法を教えてもらったのですが、最近になって困ったことになりました。 それは、あっちこっちで確認をしましたところ、実はMACでは何ともなかったものの、Winのパソコンで変な場所に大体正確にではありませんが、画面端から約100×100の位置に出てしまうパソコンが何台かあるのに気が付きました。 ソースを書きます。 <SCRIPT language="JavaScript"> <!-- function newWin(){ w = screen.availWidth ; h = screen.availHeight ; window.open("op_01q.html","newWin","width="+w+",height="+h) ; window.moveTo(-1,-1) ; } //--> </SCRIPT> で、できるとは思いますが、何か足りないのか分かりません。 どうか宜しくお願いします。

  • JAVA SCRIPTのウィンドウサイズの調整について

    JAVA SCRIPTのウィンドウのサイズの調整についてお聞きしたいのです。 私は自分のサイトのトップページの<HEAD>のあとに、 <script language="Javascript"> <!-- function newwin(){ var win1=window.open('***.htm','newwindow', 'toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,width=200,height=200'); } //--> </script> を挿入していますが、 これだけでは、どのウィンドウも200×200のサイズで開かれてしまいます。 開くウィンドウによってサイズを変えたいのです。 具体的に例をあげると、トップページからのリンク先Aは、200×200のサイズ、 リンク先Bは、400×400のサイズ、 という具合に、それぞれのJAVA SCRIPTのサイズを変えて表示させたいのですが、 やり方がわかりません。 どなたかご教示していただけると大変助かります。 よろしくお願いいたします。

  • 別ウィンドウでスクロールバーを表示させる

    画面中央位置に別ウィンドウを開くまでは上手くいったのですが スクロールバーを表示させることができません・・・。 こちらのソースにスクロールバーを表示させるソースを加えたいのですが どうしたらいいでしょうか・・。知識があまり無いのにサンプルを拾ってきて応用しましたのでわかりません・・。初歩的な質問ですみません・・・・ <script type="text/javascript"> function popWin1() { var popW = 521; var popH = 690; window.open('/html/page72.html', 'pop', 'width='+popW+',height='+popH+',top='+((screen.height-popH)/2)+',left='+((screen.width-popW)/2)); } </script>

  • 中央に、アドレスバー表示した別窓を表示

    別窓を中央に開くため、 次のものを用意したのですが、その別窓にアドレスバーを表示させたいのです。 どこをどうしたらよいのでしょうか。 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を使用し Another HTML-lint gatewayで文法チェックしたら XHTMLでは <SCRIPT> や <STYLE> の内容が #PCDATA です。コメントはコメントとして解釈されてしまうので、旧来のテクニックは使えません。外部にスクリプトファイルやスタイルファイルを用意するようにしましょう。 とでました 下記のJavaScriptを外部形式にするにはxxx.jsに書くところまではわかりましたが書き方がわかりませんどこを変更したらいいのでしょうか <script type="text/javascript"><!-- function m_win(url,windowname,width,height) { var features="location=no, menubar=no, status=yes, scrollbars=yes, resizable=yes, toolbar=no"; if (width) { if (window.screen.width > width) features+=", left="+(window.screen.width-width)/2; else width=window.screen.width; features+=", width="+width; } if (height) { if (window.screen.height > height) features+=", top="+(window.screen.height-height)/2; else height=window.screen.height; features+=", height="+height; } window.open(url,windowname,features); } // --></script> よろしくお願いします

  • ポップアップブロック付きのブラウザ(IE8)で、window.open

    ポップアップブロック付きのブラウザ(IE8)で、window.openをつかって小窓を二つ出したい。 表題の通り、ポップアップブロックに引っかかってしまい、2つの小窓が出せません。 現状は、1つだけ小窓が立ち上がる状態です。 理想のタイミングは、エンターページをクリックすると、window.openが実行され 2つの小窓が立ち上がるというのが理想です。 以下に現在のスクリプトをコピペ致します。 <script language="JavaScript"> moveTo(0,0); resizeTo(screen.width,screen.height); var g_pop01; var g_pop02; function open_pop(){ var w_Width1 = 280 var w_Width2 = 567 var w_Height1 = 540 var w_Height2 = 540 var w_space = 22 var x1 = (screen.availWidth - w_Width1 - w_Width2 - w_space)/2; var x2 = x1 + w_Width1 + w_space var y1 = (screen.availHeight - w_Height1)/2; var y2 = (screen.availHeight - w_Height2)/2; g_pop01 = window.open("left2.swf?nowX="+x1+"&nowY="+y1,"flash_pop1",'toolbar=0,menubar=0,scrollbars=no,resizable=no,width='+w_Width1+',height='+w_Height1+',left='+x1+',top='+y1); g_pop02 = window.open("right2.swf?nowX="+x2+"&nowY="+y2+"&guideX="+x1+"&guideY="+y1,"flash_pop2",'toolbar=0,menubar=0,scrollbars=no,resizable=no,width='+w_Width2+',height='+w_Height2+',left='+x2+',top='+y2); } </script> </head> <body topmargin=0 leftmargin=0 marginwidth=0 marginheight=0 scroll="no" bgcolor="#000000"> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> <form name="frm2"> <input type="Hidden" name="fov" value="0"> </form> <tr> <td align="center" valign="middle"> <table width="484" height="260" border="0"> <tr> <td><img src="img/logo_484x260_2.png" border="0" usemap="#Map" LANGUAGE=javascript onClick="open_pop()"> <map name="Map"> <area shape="rect" coords="4,2,480,254" href="index.html"> </map></td> </tr> </table> </td> </tr> </table> </body> </html>