Branchpoint
Description:
ブラウザの種類によって、リンク先のページを自動分岐させるスクリプトです。
例えばIE用のホームページと、NN用のホームページを作った時に自動的に分岐させたい時使用します。
今回は、ブラウザのバージョン別にそれぞれ各コーナーに飛ぶようにしてあります。
Demo:
Source:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
var branch_wait = 5000; //次ページに移動するまでの待ち時間。1000=1秒
function branch() {
/* IE4.0以上 */
if(document.all) {
location.href = "http://www.microsoft.com/";
return;
}
/* NN4.x */
if(document.layers) {
location.href = "http://www.netscape.com/";
return;
}
/* NN6.0以上 */
if(document.getElementById && navigator.userAgent.indexOf("Gecko") != -1) {
location.href = "http://www.mozilla.org/";
return;
}
/* Dream Passport */
if(navigator.userAgent.indexOf("DreamPassport") != -1) {
location.href = "http://www.sega.co.jp/";
return;
}
/* その他ブラウザIE3.0やNN3.0以下など */
else {
location.href = "http://www.yahoo.co.jp/";
return;
}
}
//-->
</script>
</head>
<body onLoad="setTimeout('branch()',branch_wait)">
wait for now loading..
</body>
</html>
Advice:
スクリプト中の if(......)の中身を書きかえる事によって、色々な場合分けが可能です。主な例を以下に挙げます。
/* IE4.0以上判定 */
if(document.all) { ... }
/* IE5.0以上判定 */
if(document.all || document.getElementById) { ... }
/* Netscape4.0判定 (Netscape6.0だと無効です)*/
if(document.layers) { ... }
/* Netscape6.0以上(Gecko)判定 */
if(document.getElementById && navigator.userAgent.indexOf("Gecko") != -1) { ... }
/* IE5.0以上・NN6.0以上。 */
if(document.getElementById) { ... }
/* DreamPassport判定 */
if(navigator.userAgent.indexOf("DreamPassport") != -1) { ... }
/* JavaScriptによる画像操作が可能なブラウザを判定 (IE4.0/NN3.0/DreamPassport2.0/Opera3.0以上) */
if(document.images) { ... }
/* Windows判定 */
if(navigator.userAgent.indexOf("Win") != -1) { ... }
/* Mac判定 */
if(navigator.userAgent.indexOf("Mac") != -1) { ... }
以上が主な分岐パターンですが、&& や || を利用する事によって、複数の条件を指定する事が出来ます。
/* DHTML対応ブラウザ判定 (IE4.0以上、NN4.0、NN6.0以上)*/
if(document.all || document.layers || document.getElementById) { ... }
/* IE4.0以上+Windows環境判定 */
if(document.all && navigator.userAgent.indexOf("Win") != -1) { ... }
Arrangement:
Browser:
Internet Explorer3.0以上
Netscape Navigator2.0以上