onmouseleaveイベント
onmouseleave イベント
インスタンス
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<img onmouseenter="bigImg(this)" onmouseleave="normalImg(this)" border="0" src="smiley.gif" alt="Smiley" width="32" height="32">
<p>
bigImg() 函数在用户将鼠标指针移动到该图像时触发。</p>
<p>
normalImg() 函数在用户将鼠标指针移出图像时触发。</p>
<script>
function bigImg(x) {
x.style.height = "64px";
x.style.width = "64px";
}
function normalImg(x) {
x.style.height = "32px";
x.style.width = "32px";
}
</script>
</body>
</html>インスタンスの実行 »
オンラインインスタンスを表示するには、「インスタンスの実行」ボタンをクリックしてください
その他のデモを表示するには、以下のその他の例の中から「試してみる」をクリックしてください。
定義と使用法
onmouseleave イベントは、マウスが要素を削除するとトリガーされます。
ヒント: このイベントは通常、onmouseenter イベントと一緒に使用されます。 このイベントは、マウスが要素上に移動すると発生します。
ヒント: onmouseleave イベントは onmouseout イベントに似ています。 唯一の違いは、onmouseleave イベントがバブリングをサポートしていないことです。
ブラウザのサポート
表内の数字は、イベントをサポートする最初のブラウザのバージョン番号を示します。
| イベント | |||||
|---|---|---|---|---|---|
| オンマウス | 30.0 | 5.5 | は | 6.1 | 11.5です |
構文
HTML:
<element onmouseleave="myScript">試してみる
JavaScript:
object.onmouseleave=function() myScript };試してみてください
JavaScript では、addEventListener() メソッドを使用します:
object.addEventListener("mouseleave", myScript); 試してみてください
注: Internet Explorer 8 以前の IE のバージョンaddEventListener() メソッドはサポートされていません。
技術的な詳細
| バブリングがサポートされているかどうか: | いいえ |
|---|---|
| キャンセル可能: | いいえ |
| イベントタイプ: | MouseEvent |
| サポートされている HTML タグ: | <Base>、<BDO>、Result、<HEAD>、<HTML>、<IFRAME>、<META>、<を除くすべての HTML 要素<SCRIPT>、<STYLE>、<Title> 「インスタンスを実行」ボタンをクリックしてオンラインインスタンスを表示します |
