.onmouseout
現在の要素上のonMouseOutイベントハンドラのコードを返します。また、現在の要素に対してonMouseOutイベントハンドラの関数を割り当てます。
文法
element.onMouseOut = function;
例
<!doctype html>
<html>
<head>
<title>onmouseover/onmouseout event example</title>
<script type="text/javascript">
function initElement(){
var p = document.getElementById("foo");
p.onmouseover = showMouseOver;
p.onmouseout = showMouseOut;
}
function showMouseOver(){
var notice = document.getElementById("notice");
notice.innerHTML = 'マウスオーバーを検知';
}
function showMouseOut(){
var notice = document.getElementById("notice");
notice.innerHTML = 'マウスアウトを検知';
}
</script>
<style type="text/css">
#foo {
border: solid blue 2px;
}
</style>
</head>
<body onload="initElement()";>
<span id="foo">My Event Element</span>
<p>上記の要素上でマウスオーバー、アウトを試してください。</p>
<div id="notice"></div>
</body>
</html>
注意事項
mouseoutイベントは、マウスが要素から離れた際に発生します。 (例えば、Webページ内の画像からマウスが移動する(出て行く)と、 その画像要素でmouseoutイベントが発生します。)
仕様
DOMレベル0。 仕様の一部ではありません。
© 2017 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
このページは、ページトップのURL先のMozilla Developer Network(以下、MDN)のコンテンツを翻訳した内容を基に構成されています。 構成について異なる点も含まれますので、下記の項目を確認し、必要に応じて元のコンテンツをご確認ください。 もし、誤訳などの間違いを見つけましたら、 @tomofまで教えていただければ幸いです。
- 特定のブラウザに特化しすぎている情報やあまりにも古い情報、 または試験的に導入されているようなAPIや機能については、省略していることがあります。
- 例やデモについて、実際にページ内で動作させる関係で一部ソースコードを変更している場合や、 その例で使用しているコンテンツの単語や文章などを日本人向けに変更しいてる場合があります。
- MDNの更新頻度が高いため、元のコンテンツと比べ情報が古くなっている可能性があります。
- "訳注:"などの断わりを入れた上で、日本人向けの情報の追記を行っている事があります。