Dialog

サイズを指定して Dialog を開きます。
Dialog はマウスのクリックで閉じます。
320x240サイズでダイアログを開く

  1. "dlg.html" を呼び出して Dialog を開きます。
    以前は showModalDialog() が使えたのですが 廃止された ようです。
    少量のタイプ入力は prompt() を使って下さい。
    function mdlg()
{
  showModalDialog("dlg.html");
}
  2. showModalDialog() が使えないので window.open() を使うことにします。
    Dialog を呼び出すソースコードです。
    href="javascript:mdlg()" のクリックで mdlg 関数を呼び出します。
    mdlg 関数から dlg.html を呼び出します。
    window.open("dlg.html","dlg","Width=320,Height=240"); で Dialog のサイズを設定します。
    【Source Code】 
    <script type="text/javascript">
function mdlg()
{
  window.open("dlg.html","dlg","Width=320,Height=240");
}
</script>
</head>

<body>
<h2>Dialog</h2>
サイズを指定して Dialog を開きます。<br>
Dialog はマウスのクリックで閉じます。<br>

<a href="javascript:mdlg()">320x240サイズでダイアログを開く</a><br>
  3. 呼び出される dlg.html です。
    マウスをクリックすると mousedown() 関数が呼び出されて close() で閉じます。
    close() が使えるのは window.open() で開いたページに限ります。
    【dlg.html Source Code】 
    <html>
<head>
<meta charset="UTF-8">
<title>Dialog</title>
<script type="text/javascript">
window.onmousedown = mousedown;
function mousedown()
{   close();  }
</script>
</head>

<body>
<h3>dlg.html</h3>
<div id="div_id">
他のページから<br>
呼び出される HTML<br>
マウスクリックで閉じる<br>
</div>
</body>
</html>

従来の window.open の書き方です。
  window.open("dlg.html","dlg","dialogWidth:320px;dialogHeight:240px");

前田稔の超初心者のプログラム入門
超初心者のプログラム入門(JavaScript)