JavaScriptで以下の条件のソースを書いてください。

よろしくお願い致します。
・HPに4つのボタンがあり、押すとそれぞれ違う大きさのウィンドウが開く。
・開いたウィンドウはアドレスバー、メニューバー、ステータスバーは表示されていない




回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2013/09/21 10:02:58
  • 終了:2013/09/21 11:35:52

ベストアンサー

id:holoholobird No.1

holoholobird回答回数574ベストアンサー獲得回数1042013/09/21 10:39:28

ポイント400pt
<a href="javascript:void(0);" onclick="window.open('example1.html', 'mywindow1', 'width=100, height=300, menubar=no, toolbar=no, scrollbars=yes');">子ウインドウ1</a>
<a href="javascript:void(0);" onclick="window.open('example2.html', 'mywindow2', 'width=200, height=700, menubar=no, toolbar=no, scrollbars=yes');">子ウインドウ2</a>
<a href="javascript:void(0);" onclick="window.open('example3.html', 'mywindow3', 'width=300, height=100, menubar=no, toolbar=no, scrollbars=yes');">子ウインドウ3</a>
<a href="javascript:void(0);" onclick="window.open('example4.html', 'mywindow4', 'width=400, height=200, menubar=no, toolbar=no, scrollbars=yes');">子ウインドウ4</a>

をページに追加してください。
開いたウインドウに表示させるページのアドレスがそれぞれexample1.html~example4.htmlです。

id:manekinekoo

ありがとうございます。問題なくできました。

2013/09/21 11:33:36

その他の回答(1件)

id:holoholobird No.1

holoholobird回答回数574ベストアンサー獲得回数1042013/09/21 10:39:28ここでベストアンサー

ポイント400pt
<a href="javascript:void(0);" onclick="window.open('example1.html', 'mywindow1', 'width=100, height=300, menubar=no, toolbar=no, scrollbars=yes');">子ウインドウ1</a>
<a href="javascript:void(0);" onclick="window.open('example2.html', 'mywindow2', 'width=200, height=700, menubar=no, toolbar=no, scrollbars=yes');">子ウインドウ2</a>
<a href="javascript:void(0);" onclick="window.open('example3.html', 'mywindow3', 'width=300, height=100, menubar=no, toolbar=no, scrollbars=yes');">子ウインドウ3</a>
<a href="javascript:void(0);" onclick="window.open('example4.html', 'mywindow4', 'width=400, height=200, menubar=no, toolbar=no, scrollbars=yes');">子ウインドウ4</a>

をページに追加してください。
開いたウインドウに表示させるページのアドレスがそれぞれexample1.html~example4.htmlです。

id:manekinekoo

ありがとうございます。問題なくできました。

2013/09/21 11:33:36
id:a-kuma3 No.2

a-kuma3回答回数4363ベストアンサー獲得回数18002013/09/21 11:06:01

ポイント100pt

こんな感じで。

<script>
window.onload = function() {
        function bind (id, w, h, url) {
            var e = document.getElementById(id);
            e.onclick = function() {
                    var opt = "width=" + w + ", height=" + h +
                        ", menubar=no, toolbar=no, statusbars=no";
                    window.open(url, '', opt)
                }
        }

        /*
            ウィンドウの大きさや、URL は、以下のところを変更
        */
        //   ボタンのID, 幅 , 高さ, URL
        bind("win1"    , 200, 100 , "http://q.hatena.ne.jp/");
        bind("win2"    , 200, 500 , "http://h.hatena.ne.jp/");
        bind("win3"    , 600, 100 , "http://d.hatena.ne.jp/");
        bind("win4"    , 600, 500 , "http://b.hatena.ne.jp/");
    }
</script>

<button id="win1">人力検索</button>
<button id="win2">ハイク</button>
<button id="win3">ダイアリー</button>
<button id="win4">ぶくま</button>


jsFiddle で、動作を確認したのがこちら。
http://jsfiddle.net/a_kuma3/2u5g2/

id:manekinekoo

ありがとうございました。

2013/09/21 11:33:51

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません