onmouseoutとは?
|
onmouseout属性, onmouseover属性は、どちらもポインティングデバイス(pointing device)の動作によりイベントが発生するイベント属性(イベントハンドラ)です。 onmouseover属性は、当該要素にポイント(カーソル)が合わさったときに、onmouseout属性は、当該要素内に入っていたポイントが外れたときに起動するスクリプトを指定します。 ※onmouseout属性, onmouseover属性は、ポインティングデバイスがない環境では、まったく操作できなないので注意してください。 onmouseover属性, onmouseout属性を組み合わせて img要素にポイントが合わさると、それまで表示されていた画像と切り替わり、img要素からポイントが外れると元の画像に戻るといったロールオーバー(Rollover)と呼ばれる仕組みによく利用されています(サンプル参照)。その他にもフォームのコントール部品にマウスが合わさると背景色を変えるなど一時的にその部分を目立たせたりするのにも役立ちます。 また、onmouseover属性, onmouseout属性のように当該要素の上でのポイント(カーソル)の動作によりイベントを発生させる属性に、onmousemove属性があります。これらの属性を同じ要素に併せて指定している場合、onmouseover→onmousemove→onmouseout の順でイベントが発生します。onmouseover属性と onmousemove属性のイベントが発生する動作は異なり、onmouseover属性は、要素内にポイントが入ったときに一度だけ発生し、その後要素内で動かしているだけではイベントは起こらず、要素内にポイントを出入りさせると再びイベントが発生します。これに対して、onmousemove属性は、要素内でポイントを少しでも動かすと、その度にイベントが発生します。 次のスクリプトでは、表の行(tr要素)にポイント(カーソル)が合わさると、セルの背景色を "deepskyblue" に塗り、tr要素内に含まれているセルからポイントが外れると元の色にします。これは、Win版Internet Explorer 6 では、a要素をセレクタとする場合にしか対応していない CSS の :hover疑似クラスを JavaScript で代替実現するのに有用です。 次のスクリプトでは、アンカーにポイントが合わさると textarea要素にリンク先の説明を表示します。 次のスクリプトは、画像にポイントが合わさると表示されていた画像と切り替わり、画像からポイントが外れると元の画像に戻るロールオーバーです。 この文書の最新版はw3g.jp配下の「onmouseout属性 onmouseover属性」に移動済みです。内容が古くなっていたり、間違いを含んでいる可能性があるので、必ず最新版を参照ください。 |
[ 40] onmouseout属性 onmouseover属性 HTML辞典
[引用サイト] http://www.seo-equation.com/html/html/onmouseout
