• トップページ
  • 記事リスト
  • ギャラリー
  • プロフィール
  • 記事へのコメント

白いフランス車乗りのブログ ロゴ

  • サイズが異なるサブウインドウを開き直す方法(2022/01/16)

    本文を補足するためサブウインドウを開くのは javascript を使えば容易だが、いくつも開くと目障りなことがある。
    そこでコンテンツだけを入れ替えようとしても、最初に開いたサブウインドウのサイズを変えることはできない。
    コンテンツのサイズがまちまちでも対応できる方法があったので、忘備録として書きとめておく。

    javascript

    次の2つのサブウインドウを開いてみる。

    • Window A(300px X 300px)
    • Window B(200px X 200px)

    初めに開いたウインドウを閉じずに次のウインドウを開くと、初めに開いたウインドウと同じサイズになってしまう。
    適切にコードを書けば、いちいちウインドウを閉じなくても、それぞれの指定サイズで開くことができる。

    • Window A
    • Window B

    コードは以下のとおり。

    <script type="text/javascript" language="javascript">
    var winObj;
    function OpenWindowA() {
      if((winObj)&&(!winObj.closed)){
        winObj.close();
      }
      winObj=window.open("../details/window_a.html","subwindow","toolbar=no,location=no,directories=no,
    status=no,menubar=no,scrollbars=no,resizable=yes,width=300,height=300,left=0,top=0");
    }
    function OpenWindowB() {
      if((winObj)&&(!winObj.closed)){
        winObj.close();
      }
      winObj=window.open("../details/window_b.html","subwindow","toolbar=no,location=no,directories=no,
    status=no,menubar=no,scrollbars=no,resizable=yes,width=200,height=200,left=0,top=0");
    }
    winObj=null;
    </script>

    ようするに、開いているウインドウがあれば閉じてから別のを開くというだけのこと。

    複数組のコンテンツを別々のサブウインドウで開きたい場合は、"winObj" と "subwindow" を別名にすればよい。

    <script type="text/javascript" language="javascript">
    var winObj2;
    function OpenWindowA() {
      if((winObj2)&&(!winObj2.closed)){
        winObj2.close();
      }
      winObj2=window.open("../details/window_a.html","subwindow2","toolbar=no,location=no,directories=no,
    status=no,menubar=no,scrollbars=no,resizable=yes,width=300,height=300,left=0,top=0");
    }
    function OpenWindowB() {
      if((winObj2)&&(!winObj2.closed)){
        winObj2.close();
      }
      winObj2=window.open("../details/window_b.html","subwindow2","toolbar=no,location=no,directories=no,
    status=no,menubar=no,scrollbars=no,resizable=yes,width=200,height=200,left=0,top=0");
    }
    winObj2=null;
    </script>

    < 前の記事  次の記事 >

© FC Rider. All rights reserved.