[ JavaScript ] ポップアップウインドウを開くサンプル

↓この記事が気に入ったら、ぜひシェアをお願いします!

JavaScript で別ウィンドウを開くサンプルです。

スポンサーリンク

ウインドウを開く悪い例

JavaScript でポップアップウインドウを開く時、下のように書いてしまうと、JavaScript がオフの場合、ウインドウが開けません。

<a href="javascript:window.open('a.html','a','width=600');">開く</a>

ウインドウを開く良い例

こんな感じで書きます。

<a href="a.html" onClick="javascript:window.open('a.html','a','width=600'); return false;">開く</a>

利点

  • JavaScript がオフでも何とかウインドウが開ける。
  • 右クリックを使う事で、新規ウインドウや新規タブで開く事ができる。
  • 右クリックを使う事で、リンク先のページをブックマークできる。
  • ステータスバーでリンク先がわかる
  • 検索エンジンがクロールしてくれる

ユーザがどうやって開くか選択できるのが良いですね。

window.open の書式

window.open("URL","任意のウインドウ名","属性1,属性2");

window.open の属性一覧

属性名 内容 指定方法
toolbar ツールバーの表示/非表示 yes or no
location URL 入力欄の表示/非表示 yes or no
sutatus ステータスバーの表示/非表示 yes or no
menubar メニューバーの表示/非表示 yes or no
scrollbar スクロールバーの表示/非表示 yes or no
resizable ウインドウのリサイズ可/不可 yes or no
directories ディレクトリの表示/非表示 yes or no
wideth ウインドウの横幅 pixel
hight ウインドウの縦幅 pixel

※ yesの代わりに1、noの代わりに0を使用できる。デフォルト値はno

スポンサーリンク

↓この記事が気に入ったら、ぜひシェアをお願いします!

↓ブログをフォローすると更新情報が届きます。

スポンサーリンク

コメント

  1. […] JavaScript: ポップアップウインドウの開き方 | Bowz::Notebook を参考にすると以下のような感じ。 […]