ウインドウが隠れる落とし穴 | デザインってオモシロイ -MdN Design Interactive-
【サイトリニューアル!】新サイトはこちらMdNについて


Webデザインには、あなたの知らない「落とし穴」がたくさん。大きなものから小さなものまで、それが及ぼす影響はさまざまだ。カンペキだと思っているあなたのサイトも、実はすでに暗い穴の中かも・・・。




ウインドウが隠れる落とし穴


 ポップアップなどの用途でwindow.openのJavaScriptを使用して任意のウインドウを開く機会は多々あるだろう。

このとき、ポップアップしたウインドウを閉じずに開いた元のウインドウに戻ると、ポップアップされたウインドウは当然背面に回る。ここで、元の画面から再度同じポップアップウインドウを開こうとしてもポップアップウインドウはアクティブになることなく、元のウインドウの背面で再度読み込まれてしまうため、あたかもボタンが機能していないかのような錯覚に陥ることになる。例外としてwindow nameを省略した場合にはこの限りではないが、同じウインドウをたくさん開けてしまうという弊害があるため、この方法はお勧めできない。

そこでボタンを押した時点でポップアップウインドウの状態を必ずアクティブに戻すJavaScriptを使用する。スクリプト自体は簡単だ。まず、開くウインドウを変数にして、そのウインドウ変数.focus();で機能する。具体的な用途としては、以下のプログラムを参照していただきたい【1】。(文=マルチカ)


sub=window.open("xxx.html","name"," width=120,height=120");
sub.focus();
【1】開くウインドウを変数にし、それに対してfocus()を作用させる

解説:横山 剛

(※本文中、及びキャプション内で使用している「<」、「>」は、全角になります。ご注意ください。)





twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在