例
画像の外にマウスポインタを移動するときにJavaScriptを実行します。
<img onmouseleave="normalImg(this)" src="smiley.gif" alt="Smiley">
»それを自分で試してみてください もっと"Try it Yourself"以下の例。
定義と使用法
マウスポインタが要素の外に移動したときonmouseleaveイベントが発生します。
ヒント:このイベントは、しばしば一緒に使用されるonmouseenterマウスポインタが要素の上に移動したときに発生するイベント、。
ヒント:onmouseleaveイベントはに似ていれるonmouseoutイベント。 唯一の違いは、onmouseleaveイベントはバブルがないということである(does not propagate up the document hierarchy) 。 参照"More Examples"より良い違いを理解するために、このページの下部にあります。
ブラウザのサポート
表中の数字は完全にイベントをサポートする最初のブラウザのバージョンを指定します。
イベント | |||||
---|---|---|---|---|---|
onmouseleave | 30.0 | 5.5 | はい | 6.1 | 11.5 |
構文
HTMLには:
JavaScriptで:
object .onmouseleave=function(){ »それを自分で試してみてください
JavaScriptでは、使用してaddEventListener()メソッドを:
object .addEventListener("mouseleave", myScript );
»それを自分で試してみてください 注: addEventListener()メソッドは、Internet Explorer 8およびそれ以前のバージョンでサポートされていません。
技術的な詳細
バブル: | ノー |
---|---|
取消し可能: | ノー |
イベントの種類: | MouseEvent |
サポートされているHTMLタグ: | <ベース>、<BDO>、<BR>、<HEAD>、<HTML>、<iframe>の、<メタ>、<PARAM>、<SCRIPT>、<スタイル>、および:以外のすべてのHTML要素、 <title> |
DOMバージョン: | レベル2のイベント |
その他の例
例
この例ではれるonmousemove、onmouseleaveとイベントれるonmouseoutの違いを示しています。
<div onmousemove="myMoveFunction()">
<p id="demo">I will
demonstrate onmousemove!</p>
</div>
<div
onmouseleave="myLeaveFunction()">
<p id="demo2">I will demonstrate onmouseleave!</p>
</div>
<div
onmouseout="myOutFunction()">
<p id="demo3">I will
demonstrate onmouseout!</p>
</div>
»それを自分で試してみてください <イベントオブジェクト