| ポイント |
<![CDATA[
scrnW = screen.width;
scrnH = screen.height;
winW = subWin.document.body.clientWidth;
winH = subWin.document.body.clientHeight;
x = (scrnW - winW) /2;
y = (scrnH - winH) /2;
subWin.moveTo(x,y);
]]>
|
| 説 明 |
クリックされたらサブウィンドウを画面中央に移動させるにはモニタ画面幅からサブウィンドウ幅を減算し２で割った値を座標として設定します。ただし、メニューバーやタスクバーなども考慮する場合にはavailWidth、availHeightをモニタ画面とします。また、サブウィンドウのタイトルバーや外枠などはInternet Explorerでは取得できないため正しく中央には配置されません。これを調節するのであれば、ウィンドウ幅に外枠のサイズを加算してから処理を行います。サブウィンドウを開く場合に明確にサイズが決まっている場合には、その値から計算して処理するのも１つの方法です。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>クリックしたらサブウィンドウをモニタ画面の中央に移動する（親ウィンドウから制御）</title>
<script Language="JavaScript"><!--
subWin = window.open("sub.html","sub","width=320,height=240");
function setCenter()
{
scrnW = screen.width;
scrnH = screen.height;
winW = subWin.document.body.clientWidth;
winH = subWin.document.body.clientHeight;
x = (scrnW - winW) /2;
y = (scrnH - winH) /2;
subWin.moveTo(x,y);
}
// --></script>
</head>
<body>
ボタンをクリックするとサブウィンドウをモニタ画面の中央に移動させます。
<form>
<input type="button" value="中央に移動" onClick="setCenter()">
</form>
</body>
</html>
]]>
|
| 補足説明 |
NetscapeおよびMacOS X + SafariおよびiCab 2.xでは正しい位置にセンタリングすることはできません。
サブウィンドウのHTMLは以下の通りです。
<![CDATA[
<html>
<head>
<title>クリックしたらサブウィンドウをモニタ画面の中央に移動する（親ウィンドウから制御）</title>
</head>
<body>
サブウィンドウです。
</body>
</html>
]]>
|
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
クリックしたらサブウィンドウをモニタ画面の中央に移動する（親ウィンドウから制御）