Macfirefox3とMacfirefox2以下でCSSを切り替えたい

質問

MacのFirefox3は、Firefox2までとはデフォルトフォントサイズが
違うので、Firefox3とそれ以外のFirefoxで分けたいです。

今まで、CSSを以下のスクリプトでブラウザ別に分岐していました。
MacのFirefox3の分岐を増やしてみたのですが、それ以外のFirefoxのCSSに
分岐されてしまいます。
あまりJavascriptに明るくないので、
どうしてわかれてくれないものか困っています。
どうぞお知恵をお貸し下さい！

↓以下、かいてみたソースです。

var Win=(navigator.userAgent.indexOf("Win")!=-1);
var Mac=(navigator.userAgent.indexOf("Mac")!=-1);
var Explorer=(navigator.appName.indexOf("Explorer")!=-1);
var Firefox=(navigator.userAgent.indexOf("Firefox") !=-1);
var Netscape=(navigator.appName.indexOf("Netscape")!=-1);
var opera=(navigator.userAgent.indexOf("Opera")!=-1);
var safari=(navigator.userAgent.indexOf("Safari")!=-1);
var Version=navigator.appVersion.charAt(0);
if(safari){
document.write('<LINK rel="stylesheet" href="/css/mac_safari.css" type="text/css">');
}
else if(Win && Explorer && Version=="6"){
document.write('<LINK rel="stylesheet" href="/css/win_ie.css" type="text/css">');
}
else if(Win && Firefox){
document.write('<LINK rel="stylesheet" href="/css/win_ie.css" type="text/css">');
}
else if(Win && opera){
document.write('<LINK rel="stylesheet" href="/css/win_ie.css" type="text/css">');
}

/*増やしたところ*/
else if(Mac && Firefox && Version=="3"){
document.write('<LINK rel="stylesheet" href="/css/mac_safari.css" type="text/css">');
}/*増やしたところ終わり*/

else if(Mac && Firefox){
document.write('<LINK rel="stylesheet" href="/css/mac.css" type="text/css">');
}
else if(Mac && opera){
document.write('<LINK rel="stylesheet" href="/css/mac_safari.css" type="text/css">');
}
else if(Win && Netscape && Version=="4"){
document.write('<LINK rel="stylesheet" href="/css/win_nn.css" type="text/css">');
}
else if(Mac && Explorer && Version=="5"){
document.write('<LINK rel="stylesheet" href="/css/mac_safari.css" type="text/css">');
}
else if(Mac && Netscape && Version=="7"){
document.write('<LINK rel="stylesheet" href="/css/mac.css" type="text/css">');
}
else if(Mac && Netscape && Version=="4"){
document.write('<LINK rel="stylesheet" href="/css/mac.css" type="text/css">');
}
else{
document.write('<LINK rel="stylesheet" href="/css/font.css" type="text/css">');
}

回答No.1

noname#137826 · ベストアンサー

こんにちは。

直接的な答えと致しましては・・・
Firefoxのバージョンの区別は navigator.appVersion ではなく navigator.userAgent で行います。

navigator.userAgent.indexOf("rv:1.9")!=-1 // Firefox 3 で true
navigator.userAgent.indexOf("rv:1.8.1")!=-1 // Firefox 2 で true

で区別できます。
参考URLをご覧になるとおわかりになると思いますが、navigator.appVersion では区別がつきません。

間接的な答えと致しましては・・・
全ての場合を過不足無く区別するコードを書くのはかなり大変です。prototype や jQuery といったライブラリを使用することを検討なさるのがよいかと思います。

# さらに間接的な答えと致しましては・・・
# おせっかいは承知なのですが、フォントサイズは変更して使われている方も多いのでは？(私もそうです)
# ブラウザで分けたところで、どこまで実効性があるのでしょう・・・

参考URL：

http://www.openspc2.org/userAgent/

お礼

kaorineさん＞

ご回答ありがとうございました、
大変助かりました！
ライブラリの利用も今後視野に入れたいと思います。

フォントサイズの変更についてですが、
私自信、ブラウザのフォントは自分で調整しています…。
しかしどうしても振り分けたい場合があったもので。
また、どうしてもWindowsとMacのフォントサイズ差が
気になってしまうのですよね…。；；
どのブラウザもデフォルトフォントサイズを
一緒にしてくれると良いのですが！
ご回答ありがとうございました。