ネットショップやサイトを作成しているとき、リンク先を新しいタブで開くように設定することってよくありますね。
たとえば、購入ガイドとかよくある質問のページなんかを新しいタブで開いたりすると、ショップサイトが今見ている画面からぜんぜん見えなくなってしまいます。
見えなくなるのが嫌なので、今回は、リンク先をサブウインドウで表示するようにしてみよう。
サブウインドウを表示する方法
テキストや画像をクリックすると、サブウィンドウを開くスクリプトです。
実装は至って簡単。
<body>～</body>内のサブウインドウが開くテキストなり画像を置くところに以下を記述します。
<a href="ここにサブウインドウで表示したいURL"onclick="window.open('ここにサブウインドウで表示したいURL','subwin','width=320,height=500');return false;">ここに書いたテキストがリンクになります</a>
テキストの場合
<a href="ここにサブウインドウで表示したいURL"onclick="window.open('ここにサブウインドウで表示したいURL','subwin','width=320,height=500');return false;">ここに書いたテキストがリンクになります</a>
画像（アイコン）の場合
<a href="ここにサブウインドウで表示したいURL"onclick="window.open('ここにサブウインドウで表示したいURL','subwin','width=320,height=500');return false;"><img src="画像のパス（URL）" width="画像の幅" height="画像の高さ" alt="代替テキスト"></a>
サブウィンドウの横幅、サブウィンドウの高さの設定は、 width=幅
height=高さ の数字をすきな大きさの数字に変更してください。
height=高さ の数字をすきな大きさの数字に変更してください。