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