お手軽な(?)ロールオーバーイメージとに続き、
同じ手法を使った「サブウインドウポップアップ」スクリプトです。
Ex.)
サブウインドウ用のHTMLを用意。
ポップアップ用リンクタグに「popup」の文字を含めた target オプションを指定。
rel に"幅,高さ"を指定するとそのサイズでウインドウをオープンする。
(<a href="subwin.html" target="popup" rel="400,200">別ウインドウを開く</a>)
※下の javascript では、デフォルトの幅を640px固定です。その他の window.open オプションはスクリプトの中を覗いて下され(^^;)
【popup.js】
//-------------------------------------
// Popup Window
//-------------------------------------
function setPopUp() {
if(!document.getElementsByTagName) return false;
var popUpList = document.getElementsByTagName('a');
for(var i = 0; i < popUpList.length; i++) {
if(popUpList[i].target.match(/popup/i)) {
popUpList[i].onclick = function() {
if(this.rel) {
var r = this.rel.split(',');
var wSize = optPopUp(r[0],r[1]);
} else {
var wSize = optPopUp();
}
var win = window.open(this.href,this.target,wSize).focus();
return false;
}
}
}
return true;
}
/* Options */
function optPopUp(h,v) {
if(!v) {
v = (navigator.userAgent.indexOf('Opera',0) >= 0)
? parent.window.innerHeight - 25
: screen.availHeight - 75;
}
if(!h) h = 640;
var opt =
',toolbar=no,location=no,directories=no,status=no'+
',menubar=no,resizable=no,scrollbars=yes'+
',screenX=0,screenY=0,left=5,top=5';
return 'width='+h+',height='+v+opt;
}
/* Onload */
function setOnLoad() {
setPopUp();
}
window.onload = setOnLoad;
この記事へのコメント