うちのSpellマスターに発注して、かなり実用的なJavascriptを作ってもらいました。
要望ポイント
- hrefの中身を.htmlとか.php的に、ファイル指定する。(javascript:void(0);とかjavascript:;とかは使わない)
- 開くウィンドウごとに、widthとheightを指定できる
- web標準準拠である
- HTMLのバージョンに依存しない
- Strictでもバリデートチェックに通過する
こんな条件で実現できるJavascriptです。
使い方
まず、<head>〜<head>にJavascriptを記述します。これは外部JSファイルにしてもOK
<script type="text/javascript"> window.onload = function (){ var node_a = document.getElementsByTagName('a'); for (var i in node_a) { if(node_a[i].className == 'popup'){ node_a[i].onclick = function() { return winOpen(this.href, this.rel) }; } } } ; function winOpen(url, rel) { var split = rel.split(',') ; window.open( url,'popup', 'width='+ split[0] +',height='+ split[1] +',toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes'); return false; }; </script>
次、HTMLのa要素には下記のように記述します。ポイントはclassとrelを使用すること。
たとえば、class=”popup”とrel=”横幅数値,縦数値” みたいに書きます。
<a class="popup" rel="300,500" href="http://www.yahoo.co.jp">ウィンドウを開く</a>
ウィンドウ幅を固定するのはいかがなものかといったユーザビリティの観点からの意見もあると思いますが、この出し方の要望はお客さんによってまだまだあります。とりあえずhrefの中身をファイルで呼べるのでSEO的にも不利にはならないはず。よろしければお試し下さい。
コメントを残す