WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:CSSをブラウザ・OS別に振り分ける

カヨコ [WriteDate : Tue Apr 24 18:21:43 2001]

JavaScript初心者で、ソースは本に載っていたものをそのまま使っているのですが、その本だと、MAC、WIN-IE、WIN-NSの3つの外部スタイルシートを読み込ませるスクリプトしか載っていないので、困っています。
MACでも、IE、NS両方とも振り分けたいんです。
今使っているソースは以下です。
このファイル自体は、フレームセットファイルでフレームを切った中のファイルなのですが、フレームセットファイルにも<script language="JavaScript">以降の記述は必要なのでしょうか?
必要な場合は、どのようにして記述したら良いか教えて下さい。
よろしくお願いします。

<HTML>
<HEAD>
<!--?-->
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=EUC-JP">
<TITLE></TITLE>
<script language="JavaScript">
<!--
mac=(navigator.appVersion.indexOf("Mac")!=-1)?true:false;
ie=(navigator.appName.charAt(0) == "M")?true:false;
ns=(navigator.appName.charAt(0) == "N")?true:false;
if (mac) {
fName = "mac.css";
}
else {
if (ie) {
fName = "win_ie.css";
}
else if (ns) {
fName = "win_ns.css";
}
}
if (fName != null) {
document.write("<LINK REL=STYLESHEET HREF='"+fName+"' TYPE='text/css'");
}

//-->
</script>
</HEAD>


y [WriteDate : Tue Apr 24 21:19:07 2001]

これで、OS、ぶうらうざ、バージョン毎に判別できるようです。
<script Language="JavaScript">
<!--
os      = getOSType();
browser = getBrowserName();
version = getBrowserVersion();
if (os == "MacOS")   dirName = "mac/";
if (os == "Windows") dirName = "win/";
if (os == "UNIX")    dirName = "unix/";
if (browser == "Netscape") dirName += "nn";
if (browser == "Explorer") dirName += "ie";
if ((version >= 3) && (version < 4))   dirName += "3.css";
if ((version >= 4) && (version < 5))   dirName += "4.css";
if ((version >= 5) && (version < 5.5)) dirName += "5.css";
if ((version >= 5.5) && (version < 6)) dirName += "5.5.css";
if ((version >= 6) && (version < 7))   dirName += "6.css";
document.write("<link rel='stylesheet' href='"+dirName+"' type='text/css'>");
// --></script>


y [WriteDate : Tue Apr 24 21:25:43 2001]

外部jsファイルが抜けてました。

以下を外部jsファイルにしてください

// Macintosh            ->  MacOS
// Windows95/98/NT/2000  -> Windows
// UNIX                  -> UNIX
function getOSType()
{
   var uAgent  = navigator.userAgent.toUpperCase();
   if (uAgent.indexOf("MAC") >= 0) return "MacOS";
   if (uAgent.indexOf("WIN") >= 0) return "Windows";
   if (uAgent.indexOf("X11") >= 0) return "UNIX";
   return "";
}
// Netscape Navigator ->  Netscape
// Internet Explorer  -> Explorer
function getBrowserName()
{
   var aName  = navigator.appName.toUpperCase();
   if (aName.indexOf("NETSCAPE") >= 0)  return "Netscape";
   if (aName.indexOf("MICROSOFT") >= 0) return "Explorer";
   return "";
}
function getBrowserVersion()
{
    var browser = getBrowserName();
    var version = 0;
    var s = 0;
    var e = 0;
    var appVer  = navigator.appVersion;
    if (browser == "Netscape")
    {
        s = appVer.indexOf(" ",0);
        version = eval(appVer.substring(0,s));
        if (version >= 5) version++;
    }
    if (browser == "Explorer")
    {
        appVer  = navigator.userAgent;
        s = appVer.indexOf("MSIE ",0) + 5;
        e = appVer.indexOf(";",s);
        version = eval(appVer.substring(s,e));
    }
    return version;
}



回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]
ChaichanPAPA's World