第48回　「サブウィンドウを開く（３）」

今回はハイパーリンク文字／画像が押されたらサブウィンドウを開く処理について説明します。ハイパーリンクはHTMLでは以下のように指定されます。
　
<a href="URL">リンク文字／画像</a>

　サブウィンドウを開きたい、という場合はサムネール画像をクリックしたら、画像がサブウィンドウに拡大（原寸大）で表示されるような事が多いと思います。この場合の処理方法には２通りあります。
　１つは前回までに使ってきたonClickイベントでサブウィンドウを開かせる方法です。この場合には以下のようになります。
　
<html>
<head>
<title></title>
<script language="JavaScript"></script>
</head>
<body>
<a href="#" onClick="subWin()">サブウィンドウを開く</a><br>
</body>
</html>

　<input type="button" onClick="処理">と同じで<a>タグ内にonClickイベントを記述します。Netscape 6, Internet Explorer 4以降などDOM（Document Object Model : ドキュメントオブジェクトモデル）に対応したブラウザであれば、ほとんどのタグにonClickイベントを記述してJavaScriptの処理を行わせることができます。これに関しては別の機会で説明します。

　次に示す方法はURLを記述する部分に
　
javascript:処理

のようにhttp://やftp://の代わりにjavascript:を使うものです。javascript:の文字は大文字でも小文字でも構いません。処理の部分にはJavaScriptの命令を書きます。多くの場合は呼び出す関数名になります。

<html>
<head>
<title></title>
<script language="JavaScript"></script>
</head>
<body>
<a href="javascript:subWin()">サブウィンドウを開く</a><br>
</body>
</html>

　この方法だとJavaScriptが動作しないブラウザでは何も処理されなくなってしまう（javascript:が解釈されないため）ので注意が必要です。

　最後にWindows版のInternet Explorerのみですがフルスクリーンでサブウィンドウを開くプログラムを以下に示します。fullscreen=yesを指定するだけの簡単なものです。

<html>
<head>
<title></title>
<script language="JavaScript"></script>
</head>
<body>
<a href="javascript:subWin()">サブウィンドウを開く</a><br>
</body>
</html>

　AltキーとF4キーを同時に押すと閉じることができます。
　サブウィンドウのパラメータは、今まで説明した以外に以下のように多くのものがありますので、いろいろ試してみると良いでしょう。

　次回は開かれたサブウィンドウの位置やサイズを変更してみます。

ブラウザバージョン　　　　　　　　　｜デフォルト値｜説　明
[N2][N3][N4][N6][N7][E3][E4][E5][E6] yes toolbar[=yes|no]|[=1|0] ツールバーの表示／非表示
[N2][N3][N4][N6][N7][E3][E4][E5][E6] yes location[=yes|no]|[=1|0] ロケーションバーの表示／非表示
[N2][N3][N4][N6][N7][E3][E4][E5][E6] yes directories[=yes|no]|[=1|0] ディレクトリバーの表示／非表示
[N2][N3][N4][N6][N7][E3][E4][E5][E6] yes status[=yes|no]|[=1|0] ステータスバーの表示／非表示
[N2][N3][N4][N6][N7][E3][E4][E5][E6] yes menubar[=yes|no]|[=1|0] メニューバーの表示／非表示（除くMac）
[N2][N3][N4][N6][N7][E3][E4][E5][E6] yes scrollbars[=yes|no]|[=1|0] スクロールバーの表示／非表示
[N2][N3][N4][N6][N7][E3][E4][E5][E6] yes resizable[=yes|no]|[=1|0] ウィンドウサイズの変更／変更不可
[N2][N3][N4][N6][N7][E3][E4][E5][E6] -- width=pixels ウィンドウの内側の横幅
[N2][N3][N4][N6][N7][E3][E4][E5][E6] -- height=pixels ウィンドウの内側の高さ
[--][--][N4][--][--][--][--][--][--] -- alwaysLowered[=yes|no]|[=1|0] 常にウィンドウを背面に表示*
[--][--][N4][--][--][--][--][--][--] -- alwaysRaised[=yes|no]|[=1|0] 常にウィンドウを前面に表示*
[--][--][N4][--][--][--][--][--][--] no dependent[=yes|no]|[=1|0] 元のウィンドウと連動し元のウィンドウが閉じられると開いた子ウィンドウも閉じられる
[--][--][N4][--][--][--][--][--][--] -- hotkeys[=yes|no]|[=1|0] セキュリティキー以外のキーを無効にする／しない（機種／OSにより正常に動作しない）
[--][--][N4][--][--][--][--][--][--] -- innerWidth=pixels ウィンドウの内側の横幅
[--][--][N4][--][--][--][--][--][--] -- innerHeight=pixels ウィンドウの内側の高さ
[--][--][N4][--][--][--][--][--][--] -- outerWidth=pixels ウィンドウの外側の横幅
[--][--][N4][--][--][--][--][--][--] -- outerHeight=pixels ウィンドウの外側の高さ
[--][--][N4][--][--][--][--][--][--] -- screenX=pixels デスクトップの左端からの座標で指定
[--][--][N4][--][--][--][--][--][--] -- screenY=pixels デスクトップの上端からの座標で指定
[--][--][N4][N6][N7][--][E4][E5][E6] yes titlebar[=yes|no]|[=1|0] タイトルバーの表示／非表示（除くMac）
[--][--][N4][--][--][--][--][--][--] -- z-lock[=yes|no]|[=1|0] 常にウィンドウを背面に表示*
[--][--][--][--][--][--][E4][E5][E6] no channelmode[=yes|no]|[=1|0] チャンネルモード
[--][--][--][--][--][--][E4][E5][E6] no fullscreen[=yes|no]|[=1|0] 全画面（フルスクリーン）モード
[--][--][--][--][--][--][E4][E5][E6] -- left=pixels デスクトップの左端からの座標で指定
[--][--][--][--][--][--][E4][E5][E6] -- top=pixels デスクトップの上端からの座標で指定

*Windowsでは他のアプリケーションを含めたウィンドウでの前後の位置関係、Macintoshではナビゲータウィンドウでの前後の位置関係となります。
**ヒストリ設定はtrueまたはfalseを指定しtrueを指定した場合オープン元のウィンドウのヒストリを継承します。

第48回 「サブウィンドウを開く（３）」

第48回　「サブウィンドウを開く（３）」