ブラウザ別にサブウィンドウサイズを指定する


動作ブラウザ 【 IE:3.0   NN:2.0
Internet Explorer Netscape Navigator Opera iCab Safari
3.0x 4.0x 4.5 5.0x 5.5 6.0 2.0x 3.0x 4.0x 4.x 6.0 7.0 7.x 8.x 2.x 1.x 2.x
Windows - -
Macintosh -
UNIX - - - - - -

ポイント var wparam = "left="+wx+",top="+wy+",width="+w+",height="+h; return window.open(sURL,"swobj",wparam);
説  明 ブラウザ別にサブウィンドウサイズを指定するには、ブラウザ名とバージョンを取得する必要があります。これらはuserAgent内の文字列で判別処理します。このため新しいブラウザやバージョンが出ると正しく動作しない可能性があります。これを防ぐために、このサンプルでは指定されていないブラウザ、バージョンの場合はデフォルトのサイズで開くようにしています。ブラウザ別に処理するために配列にブラウザ名やOS名、バージョン、サイズなどを入れておきます。一致した場合に指定されたサイズで開くようにします。
サンプル <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>サンプル</title> <script language="javascript" type="text/javascript"><!-- // 個別のサブウィンドウオープンデータ // OS名、ブラウザ名、バージョン、X座標、Y座標、横幅、縦幅 gParam = [ ["?1","?2","?3",40,60,500,500], // General Size ["WIN","IE","4",10,80,480,360], // Win IE4 ["WIN","IE","5",20,90,320,240], // Win IE5 ["WIN","IE","5.5",100,50,400,300], // Win IE5.5 ["WIN","IE","6",200,50,500,240], // Win IE6 ["WIN","FIREFOX","1",100,250,300,240], // Win Firefox 1 ["MAC","IE",5,60,370,400,240], // Mac IE5 ["MAC","SAFARI",1,200,150,400,300], // Mac Safari 1 ["MAC","SAFARI",2,50,100,400,300], // Mac Safari 2 ["MAC","FIREFOX","1",150,250,300,400], // Mac Firefox 1 ]; // サブィンドウをOS別、ブラウザバージョン別に開く // 最初がオープンパラメータ、次が表示ページURL function subwinOpen(swdata,sURL) { var bName = getBrowserName(); var ver = getVersion(); var OSName = getOSName(); var i,wx,wy,w,h; // デフォルトのサイズ var wx = swdata[0][3]; var wy = swdata[0][4]; var w = swdata[0][5]; var h = swdata[0][6]; for (i=1; i<swdata.length-1; i++) { if ((swdata[i][0] == OSName) && (swdata[i][1] == bName) && (swdata[i][2] == ver)) { var wx = swdata[i][3]; var wy = swdata[i][4]; var w = swdata[i][5]; var h = swdata[i][6]; alert(OSName+","+bName+","+ver); break; } } var wparam = "left="+wx+",top="+wy+",width="+w+",height="+h; return window.open(sURL,"swobj",wparam); } // ブラウザ名を取得 // Safari --- SAFARI // Firefox --- FIREFOX // Opera --- OPERA // Netscape --- NETSCAPE // Internet Explorer --- IE // Mozilla --- MOZILLA // 不明 --- null function getBrowserName() { var ua = navigator.userAgent; ua = ua.toUpperCase(); if (ua.indexOf("SAFARI") > -1) return "SAFARI"; if (ua.indexOf("FIREFOX") > -1) return "FIREFOX"; if (ua.indexOf("OPERA") > -1) return "OPERA"; if (ua.indexOf("NETSCAPE") > -1) return "NETSCAPE"; // Ver 6-8 if (ua.indexOf("MSIE") > -1) return "IE"; if (ua.indexOf("MOZILLA/4") > -1) return "NETSCAPE"; // ver 4 if (ua.indexOf("MOZILLA") > -1) return "MOZILLA"; return null; } // ブラウザのメジャーバージョンを取得 // IE5.5だけ別 function getVersion() { var ua = navigator.userAgent; var bName = getBrowserName(); var ver = null; var s,e,n; ua = ua.toUpperCase(); switch(bName) { case "ICAB": s = ua.indexOf("/")+1; ver = ua.charAt(s); break; case "OPERA": s = ua.indexOf("OPERA")+6; ver = ua.charAt(s); break; case "SAFARI": s = ua.indexOf("SAFARI")+7; n = ua.substring(s,99); n = parseInt(n); if (n < 412) ver = 1; if (n >= 412) ver = 2; break; case "FIREFOX": s = ua.indexOf("FIREFOX")+8; ver = ua.charAt(s); break; case "IE": s = ua.indexOf("MSIE")+5; ver = ua.charAt(s); n = ua.substring(s,s+3); if (n == "5.5") ver = "5.5"; break; case "NETSCAPE": s = ua.indexOf("MOZILLA/4"); if (s > -1) { ver = 4; }else{ s = ua.indexOf("NETSCAPE")+9; ver = ua.charAt(s); if (ver == "/") ver = ua.charAt(s+1); } break; case "MOZILLA": s = ua.indexOf("RV:")+3; ver = ua.charAt(s); break; } return ver; } // OS名を取得 // Windows --- WIN // Macintosh --- MAC // UNIX --- UNIX // 不明 --- null function getOSName() { var ua = navigator.userAgent; var OSName = null; ua = ua.toUpperCase(); if (ua.indexOf("MAC") > -1) OSName = "MAC"; if (ua.indexOf("WIN") > -1) OSName = "WIN"; if (ua.indexOf("X11") > -1) OSName = "UNIX"; return OSName; } // --></script> </head> <body> <form> <input type="button" value="サブウィンドウを開く" onClick="subwinOpen(gParam,'dummy.html')"> </form> </body> </html>
補足説明 Windows XP SP2の場合にはJavaScriptでサブウィンドウを開く場合には注意が必要です。詳しくはWindows XP SP2でのJavaScriptの動作に関してのページを参照してください。また、Mozilla/Netscape 7でもポップアップウィンドウをブロックすることができます。Mozilla/Netscape 7でサブウィンドウが表示されない場合は、ポップアップウィンドウがブロックされている設定になっているかどうか確認してください。

■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!

写真素材 PIXTA