onmouseoutイベント

DOM イベント MouseEvent

定義と使用方法

マウス指標が要素またはその子要素のいずれかから外れたときにonmouseoutイベントが発生します。

ヒント：このイベントは通常、 onmouseover イベント一緒に使用すると、指標が要素またはその子要素のいずれかに入るときにこのイベントが発生します。

インスタンス

例1

マウス指標を画像から外れたときにJavaScriptを実行します：

<img onmouseout="normalImg(this)" src="smiley.gif" alt="Smiley">

自分で試してみてください

例2

この例では、onmousemove、onmouseleave、およびonmouseoutイベントの間の違いを示しています：

<div onmousemove="myMoveFunction()">
  <p id="demo">onmousemoveを実演します！</p>
</div>
<div onmouseleave="myLeaveFunction()">
  <p id="demo2">onmouseleaveを実演します！</p>
</div>
<div onmouseout="myOutFunction()">
  <p id="demo3">onmouseoutを実演します！</p>
</div>

自分で試してみてください

文法

HTMLで：

<element onmouseout="myScript">

自分で試してみてください

JavaScriptで：

object.onmouseout = function(){myScript};

自分で試してみてください

JavaScriptでaddEventListener()メソッドを使用する方法：

object.addEventListener("mouseout", myScript);

自分で試してみてください

注釈：Internet Explorer 8またはそれ以前のバージョンではサポートされていません addEventListener()メソッド。

技術的詳細

バブル： サポート
キャンセル可能： サポート
イベントタイプ： MouseEvent
サポートされているHTMLタグ： すべてのHTML要素は、以下のものを除いています：<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style>および<title>
DOM バージョン： レベル2 イベント

ブラウザサポート

イベント Chrome IE Firefox Safari Opera
onmouseout サポート サポート サポート サポート サポート
DOM イベント MouseEvent