以前、。ポップアップウインドウをOnclickでなくclassで開くという記事を書いてました。その中で、
問題点としては、各ポップアップウインドウ毎にサイズやスクロールバーの有無を個別指定できないことです。とぼやいていたら、うちのプログラマがサイズ変更可能バージョンを作ってくれました。
手順なんかは、以前の記事と一緒です。ポップアップウインドウをOnclickでなくclassで開く参照。
Javascript
とりあえず、popup.js で。
(2008/08/28追記)なぜかシングルクオートが半角になってくれないので、こちらからJSファイルをダウンロードしてご利用ください。申し訳ない。popup.js
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; };
前回同様、head 内で読み込み、ポップアップしたいリンクを普通にリンクした後、class=”popup” を追加します。
で、ここからが前回と違うところ。活目。
ウィンドウ01
rel がついてますな。
そう、JSファイル内でウインドウサイズを指定していたのをHTML側で rel を用いて指定しているんです。litebox みたなノリです。
rel=”300,500″ で横300、縦500のウインドウがポップアップで開きます。
こんな感じで各ポップアップリンクに個別にウインドウサイズを指定できるようになりました。
最近のコメント