マウスを重ねると説明文を表示

　次のリンクにマウスを重ねると、[説明]の部分に文章が表示されます。

[説明]

　また、下の画像にマウスを重ねても、同様に文章が表示されます。

設置法

　これを設置する場合、まず次のスクリプトを<head>～</head>に貼り付けてください。"説明文"は、カーソルを離したときに表示される文です。ここに何も入れていない場合、行の幅が崩れることがあります。

<script type="text/javascript">
<!--
var defmsg = "説明文";
function setMessage(msg){
    if(document.all){
        document.all("msgarea").innerHTML = msg;
    }
    else if(document.getElementById){
        document.getElementById("msgarea").innerHTML = msg;
    }
    else if(document.layers){
        document.layers["msgarea"].document.open();
        document.layers["msgarea"].document.write(msg);
        document.layers["msgarea"].document.close();
    }
}
//-->
</script>

　リンクに説明文を付けたい場合は、次のように記述したリンクを作り、「表示される説明文」を、表示したい説明文に書き換えてください。

<a href="********" onmouseover="setMessage('表示される説明文')" onmouseout="setMessage(defmsg)">********</a>

　画像に説明文を付けたい場合は、次のように記述し、「表示される説明文」を、表示したい説明文に書き換えてください。

<img src="****.gif" onmouseover="setMessage('表示される説明文')" onmouseout="setMessage(defmsg)">

　要するに、説明文を表示させたいタグの属性に「onmouseover="setMessage('表示される説明文')"」と「onmouseout="setMessage(defmsg)"」を追加すればいいということです。

　メッセージが表示される部分は、次のように記述します。「説明文」は、最初に表示されている文章です。

<div id="msgarea">説明文</div>

注意点

　表示する文章にいくつか注意点があります。説明文にはタグを使用することもできますが、「表示される説明文」にそのままタグを記述するのではなく、次のように書き換える必要があります。

& → &
< → <
> → >
" → "

　例えば、「<em>あいうえお<em>」は「<em>あいうえお<em>」のようになります。この書き換えは、特殊な文字（&, <, >）の置換で「ダブルクォートを"に置換」にチェックを入れることで、簡易に変換することもできます。「'（シングルクォート）」は「\'」のように書き換えてください。

　おそらく、Internet Explorer 4.0以降、Netscape 4.0以降で実行可能だと思います。

動作確認ブラウザ [説明]
6.0	1.0	7.1	7.5
○	○	○	○