それぞれのイベントの発生タイミングは、対象要素の上に別の要素が重なる場合に違いが現れる。 下の図は水色の要素(以降「ターゲット要素」と呼ぶ)に対してイベントハンドラを定義した場合について、どのようなタイミングでそれぞれのイベントが発火するかを示している。 現在のFirefoxではmouseover/mouseoutのみ対応しているが、jQueryなどのライブラリで、mouseenter/mouseleaveをサポートしている場合あるらしい。 mouseover/mouseout マウスカーソルの下にターゲット要素が重なったら、mouseoverが発火する。 マウスカーソルの下からターゲット要素が外れたら、mouseoutが発火する。 ターゲット要素の上に重なる別の要素の上にマウスカーソルが移動した場合も、mouseoutが発火する。 mouseenter/mouseleave マウスカーソ
![DOM Leve3 イベント mouseover/mouseout, mouseenter/mouseleave それぞれの違いについて - 今日もスミマセン。](https://cdn-ak-scissors.b.st-hatena.com/image/square/39cb04ae57bd3ec5c5589b2ea461ad59bce24894/height=288;version=1;width=512/http%3A%2F%2Fgyazo.com%2Ffe9cee617b4cdd7565c65a17b504cfdb.png)