人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

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







●質問者: manekinekoo
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● holoholobird
●400ポイント ベストアンサー
<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です。


manekinekooさんのコメント
ありがとうございます。問題なくできました。

2 ● a-kuma3
●100ポイント

こんな感じで。

<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/


manekinekooさんのコメント
ありがとうございました。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ