マウスを乗せるとテキストの色が変わる

とほほのWWW入門 > アラカルト > マウスを乗せるとテキストの色が変わる
1999年7月4日

■ 説明

ダイナミックHTMLを応用して、テキストの上にマウスを乗せると色が変わるようにします。JavaScriptでスタイルシートを変更することにより、他にも、フォントサイズを変更したり、下線をつけたり、いろいろなことが可能です。Internet Explorer 4.0以降で利用可能です。

■ 実例

このテキストの上にマウスを乗せてください。

■ ソースコード

<SPAN STYLE="font-size:24pt"
  onMouseOver="window.event.srcElement.style.color = 'red'"
  onMouseOut="window.event.srcElement.style.color = 'black'">
このテキストの上にマウスを乗せてください。
</SPAN>

■ 動作確認

IE4.0/5.0(Win)、IE4.0(Mac)で動作確認しています。NN4.0では色は変わりませんがエラーが出ないことを確認しています。

Copyright (C) 1996-1999 とほほ
http://wakusei.cplaza.ne.jp/twn/wwwxx028.htm