TOPページ >  ウィンドウを開く、閉じる、制御する > 大きさを指定してウィンドウを開く

大きさを指定してウィンドウを開く

ホームページやブログなどのウェブサイトで 他のページにジャンプする際に、簡単なJavaScriptを使って、大きさを指定して開くことができます。window.open() を使います

<a href="javascript:void(0)" onclick=window.open('ジャンプ先URL','ウィンドウの指定','スタイルの指定')">表示文字</a>
  1. ジャンプ先URL:ジャンプ先のURLを、絶対パスで指定します。
  2. ウインドウの指定:下記の中から指定できます。省略すると、今のウィンドウがジャンプ先のURLに切り替わります。今のウィンドウを残したい場合は、『_blank』とするとよいでしょう。
    _top今のフレームのトップページ(フレームが属するウィンドウ)
    _blank新しいウィンドウを開く
    _self今のフレームまたはウィンドウ
    _parent今のフレームを取り囲む一つ上の親フレーム
  3. スタイルの指定:ここでウィンドウの大きさを指定します。『width=500,height=200』というように、幅と高さを,(半角カンマ)で区切って指定します。
    そのほかにも、メニューバーやスクロールバーの有無など、さまざまな指定をすることができます。
    詳細はこちらをご覧ください→window.open() のスタイル指定一覧

設置例です

ソースは、下記のようになります。青文字部分で ジャンプ先のURL、ウィンドウの指定および開くウィンドウの大きさを指定しています。ピクセル指定になります。

<a href="javascript:void(0)" onclick="
window.open('http://html.appelle.jp/sample/linktest.html', '_blank', 'width=500,height=200');
">
ウィンドウを開く</a>

ボタンで表示する場合は、下記のようになります。

ソースはこちらです。同じように、青文字部分で ジャンプ先のURL、ウィンドウの指定および開くウィンドウの大きさを指定しています。

<button onclick="
window.open('http://html.appelle.jp/sample/linktest.html', '_blank', 'width=500,height=200')">
ウィンドウを開く</button>

ランキングに参加中です! お役に立てたらクリックをお願いします→

同一カテゴリ内一覧
一定時間後に自動でウィンドウを閉じる
ウィンドウをスクロールさせて表示する
確認メッセージを表示する
警告メッセージを表示する
ウィンドウのステータスバーに文字列を表示する
JavaScriptを使って別ウィンドウの表示内容を操作する
window.open() のスタイル指定一覧
ウィンドウのサイズ変更を禁止する
ウィンドウの位置や大きさを指定する
ポップアップウィンドウを開く
メニューバーやスクロールバーの有無を指定する
大きさを指定してウィンドウを開く
ウィンドウを閉じる
ウィンドウを開く
IEの方はこちらから当サイト ブックマークできます。
ランキング参加中!お役に立てたら クリックをお願いします。
当サイト掲載カテゴリは
Yahoo! JAPAN コンピュータとインターネット > データ形式 > HTML > リファレンス