第44回 「ウィンドウの制御」


 今回はウィンドウの制御について説明します。ウィンドウは元となるウィンドウ(親ウィンドウと呼ばれることが多くあります)、そこから開かれたウィンドウ(これはサブウィンドウ、子ウィンドウと呼ばれます)があります。今回は、ウィンドウの表示位置とサイズの変更を行ってみます。
 
 ウィンドウの表示位置を指定するにはmoveTo、moveByの2つがあります。moveToは指定された画面上の座標にウィンドウを移動させます。moveByは指定された値だけウィンドウを移動させます。例えば
 
moveTo(100,200)

であればウィンドウは画面上の座標(100,200)に移動します。

moveBy(100,200)

であれば現在の位置にX座標方向に+100、Y座標方向に+200ピクセル分、ウィンドウが移動します。
 実際にウィンドウを座標(100,200)に移動させるプログラムは以下のようになります。
 
<html>
<head>
<title></title>
<script language="JavaScript"><!--
moveTo(100,200);
// --></script>
</head>
<body>
</body>
</html>

 ページが表示される前にウィンドウが指定座標に移動します。
 次にウィンドウのサイズを変更する命令ですが、resizeTo、resizeByの2つがあります。resizeToの方は指定したサイズにウィンドウの横幅と縦幅を設定します。resizeByは指定したサイズ分だけウィンドウの横幅と縦幅に加算します。
 
resizeTo(400,300)

であればウィンドウサイズは横幅400ピクセル、縦幅300ピクセルになります。

resizeBy(-100,300)

この場合、現在のウィンドウサイズに対して横幅は-100、縦幅は300ピクセル加算されます。元のウィンドウサイズが横幅600、縦幅400だとすれば実行後には横幅500、縦幅700ピクセルサイズになります。
 実際にウィンドウサイズを変更するプログラムは以下のようになります。
 
<html>
<head>
<title></title>
<script language="JavaScript"><!--
resizeTo(600,500);
// --></script>
</head>
<body>
</body>
</html>

 ウィンドウの位置やサイズを指定する方法について説明しましたが、これだけでは画面上の中央にウィンドウを表示したりすることができません。メニューバー/タスクバーの位置にあわせたり画面の右端や下端にあわせることもできません。このような場合には、どうしても画面サイズ(モニタ画面サイズ)を取得する必要があります。
 次回は画面サイズを取得し、それにあわせてウィンドウサイズを変更する方法について説明します。







2002-2004 Copyright KaZuhiro FuRuhata (古籏一浩)