開くウインドウの位置・サイズを制御
下のボタンでサブウィンドウが開きます。
screenオブジェクトのプロパティ
- ＜screen.width＞･･･画面の横幅
- ＜screen.height＞･･･画面の縦幅
- ＜screen.availWidth＞･･･画面の有効領域だけの幅
- ＜screen.availHeight＞･･･画面からタスクバーなどの部分を除いた有効領域だけの高さ
下のボタンでサブウィンドウが開きます。
screenオブジェクトのプロパティ
Sample Source......................................................................>>>
<SCRIPT language="JavaScript"><!--
flg = 0; //ｻﾌﾞｳｨﾝﾄﾞｳが閉じられているかどうかを判別するﾌﾗｸﾞ変数
w = 0; //ｻﾌﾞｳｨﾝﾄﾞｳの横幅
h = 0; //ｻﾌﾞｳｨﾝﾄﾞｳの高さ
t = 0; //ｻﾌﾞｳｨﾝﾄﾞｳの上位置
l = 0; //ｻﾌﾞｳｨﾝﾄﾞｳの左位置
info1 = ""; //ｻﾌﾞｳｨﾝﾄﾞｳに表示する内容1
info2 = ""; //ｻﾌﾞｳｨﾝﾄﾞｳに表示する内容2
function PosWin(n){
if(n == 1){
w = screen.availWidth;
h = screen.availHeight/5;
l = 0;
t = 0;
info1 = "画面上端に、幅は画面幅いっぱい（";
info2 = "ﾋﾟｸｾﾙ）、高さは画面の1/5（";
}
if(n == 2){
w = screen.availWidth;
h = screen.availHeight/5;
l = 0;
t = screen.availHeight - h;
info1 = "画面下端に、幅は画面幅いっぱい（";
info2 = "ﾋﾟｸｾﾙ）、高さは画面の1/5（";
}
if(n == 3){
w = screen.availWidth/4;
h = screen.availHeight;
l = 0;
t = 0;
info1 = "画面左端に、幅は1/4画面（";
info2 = "ﾋﾟｸｾﾙ）、高さは画面いっぱい（";
}
if(n == 4){
w = screen.availWidth/4;
h = screen.availHeight;
l = screen.availWidth - w;
t = 0;
info1 = "画面右端に、幅は1/4画面（";
info2 = "ﾋﾟｸｾﾙ）、高さは画面いっぱい（";
}
if(n == 5){
w = screen.availWidth/3*2;
h = screen.availHeight/3;
l = (screen.availWidth - w)/2;
t = (screen.availHeight - h)/2;
info1 = "画面中央にに、幅は2/3画面（";
info2 = "ﾋﾟｸｾﾙ）、高さは1/3画面（";
} if(n == 6){ w = screen.availWidth; h = screen.availHeigh; l = 0; t = 0; info1 = "幅は画面幅いっぱい（"; info2 = "ピクセル）、高さは画面高さいっぱい,即ちフルスクリーン画面（"; }
WinOpen();
}
function WinOpen(){
if(flg == 0){
newW = window.open('','newp','width='+w+',height='+h+',left='+l+',top='+t);
newW.document.write("<body onunload='opener.flgChange()'>");
newW.document.write("<H3>開くウィンドウの大きさと位置制御</H3><HR>");
newW.document.write(info1,w,info2,h,"ﾋﾟｸｾﾙ）で開きました。");
newW.document.write("<br><br><button onclick='self.close();'>このｳｨﾝﾄﾞｳを閉じる</button>");
newW.document.close();
flg = 1;
}else{ //flg==1の場合、即ちｻﾌﾞｳｨﾝﾄﾞｳが開いたままの場合
alert("開いているサブウィンドウを閉じてください！");
}
}
function flgChange(){
//ｻﾌﾞｳｨﾝﾄﾞｳがonunloadされた時、この関数を呼び出しflg変数を0にｾｯﾄ
flg = 0;
}
//--></SCRIPT>
</head>
<body>
<form name="form1">
<input type="button" name="bt1" value="画面上端に幅いっぱいで開く" onclick="PosWin(1);">
<input type="button" name="bt2" value="画面下端に幅いっぱいで開く" onclick="PosWin(2);">
<input type="button" name="bt3" value="画面左端に高さいっぱいで開く" onclick="PosWin(3);">
<input type="button" name="bt3" value="画面右端に高さいっぱいで開く" onclick="PosWin(4);">
<input type="button" name="bt3" value="画面中央に画面の1/3の幅/高さで開く" onclick="PosWin(5);"> <input type="button" name="bt3" value="全画面（フルスクリーン）で開く" onclick="PosWin(6);">
</form>