ここで紹介したスクリプトは、InternetExplorer3.0には対応していないことは先ほども記述しました。
その上、このスクリプトを表示することにより、InternetExplorer3.0ではエラー画面が表示されてしまいます。
そこで、先ほどのスクリプトをInternetExplorer3.0以降の場合にだけ有効にするにはどのようにすれば良いのでしょう？
CGIでは、ブラウザに関係なく動作する為、環境変数$ENV{'HTTP_USER_AGENT'}等を使用することにより、様々なブラウザやVersionを判別し振り分けることが可能です。
しかしJavaScriptは、まず初めにJavaにブラウザが対応している必要があります。
ところが、InternetExplorer3.0では、先ほどのJavaScriptは動作しなくても、一部のJavaScriptはしっかりと動作します。
そこで、以下のようなスクリプトを各イベントハンドラに付け加えることにより、InternetExplorer3.0以降のブラウザ、且つ、Netscape3.0以上の場合にのみ有効にすることが出来ます。
if(navigator.appVersion.substring(0,1)>=3)
例：
<a href="URL"
onMouseOut="if(navigator.appVersion.substring(0,1)>=3)
document.images['ImageName'].src='icon1.gif';"
onMouseOver="if(navigator.appVersion.substring(0,1)>=3)
document.images['ImageName'].src='icon2.gif';"
onClick="if(navigator.appVersion.substring(0,1)>=3)
document.images['ImageName'].src='icon3.gif';">
<img name="ImageName" src="sample1.gif" width="88" height="31" border="0"></a>
ここで紹介したアニメーションアイコンの作成には、以下のような方法もあります。
ヘッダータグ（<head></head>）の間に、
<Script Language="JavaScript1.1">
<!---
var IconImage=new Array();
for(i = 1; i < 4; i++) {
IconImage[i]= new Image();
IconImage[i].src="sample"+i+".gif";
}
function SetIcon(flag, position) {
document.images[position].src=IconImage[flag].src;
}
//--->
</Script>
のようなスクリプトを書きます。
sampleの部分は、使用するアイコンの名前です。また、拡張子は.gifに統一され、この場合ファイル名は自動的にsample1.gif、sample2.gif、sample3.gifというファイルが呼び出されます。
次にLinkオブジェクトを
<a href="URL" onMouseOver="SetIcon(1,0)" onMouseOut="SetIcon(2,0)" onClick="return SetIcon(3,0)"><img src="sample1.gif" border="0"></a>
のように記述すれば完成です。
sample1.gifは初めに読み込まれる（デフォルト時）の画像名を指定します。
この場合、各イベントハンドラで指定している、(1,0) (2,0) (3,0)等は呼び出す画像と位置を指定しています。
例えば、(2,0)では、document.images[0]（配列は通常０からカウントされます）の位置の画像をsample2.gifに置き換えます。
特に(*,0)の0の部分は、Linkオブジェクトの位置によって変える（(2,1)や(2,3)等）必要がありますので、注意してください（逆にこれらの指定を変えて、より複雑な効果をもたらすことも可能です）
これらについて、もっと詳しくお知りになりたい方は、専門書やJavaScriptについて解説されているホームページなどを参照してください。（ICON'sWorldはJavaScriptの解説ページではありませんので・・・）
