onmouseenter 이벤트

DOM 이벤트 MouseEvent

정의와 사용법

마우스 포인터가 요소 위로 이동할 때 발생하는 onmouseenter 이벤트.

건의:이 이벤트는 일반적으로 onmouseleave 이벤트함께 사용하면 마우스 포인터가 요소에서 벗어날 때 이 이벤트가 발생합니다。

건의: onmouseenter 이벤트는 onmouseover 이벤트다른 차이점은 onmouseenter 이벤트가 버블링하지 않는다는 것입니다(상위 문서 계층 구조로 퍼지지 않습니다). 페이지 하단의 더 많은 예제를 참조하세요。

예제

예제 1

마우스 포인터를 이미지 위에 가져다닐 때 JavaScript를 실행합니다:

<img onmouseenter="bigImg(this)" src="smiley.gif" alt="Smiley">

직접 테스트해 보세요

예제 2

이 예제는 onmousemove, onmouseenter 및 mouseover 이벤트 간의 차이를 보여줍니다:

<div onmousemove="myMoveFunction()">
  <p id="demo">I will demonstrate onmousemove!</p>
</div>
<div onmouseenter="myEnterFunction()">
  <p id="demo2">I will demonstrate onmouseenter!</p>
</div>
<div onmouseover="myOverFunction()">
  <p id="demo3">I will demonstrate onmouseover!</p>
</div>

직접 테스트해 보세요

문법

HTML에서:

<요소 onmouseenter="myScript">

직접 테스트해 보세요

JavaScript에서:

오브젝트.onmouseenter = function(){myScript};

직접 테스트해 보세요

JavaScript에서 addEventListener() 메서드를 사용하여:

오브젝트.addEventListener("mouseenter", myScript);

직접 테스트해 보세요

주의사항:Internet Explorer 8 또는 그 이전 버전은 지원하지 않습니다 addEventListener() 메서드。

기술 세부 사항

버블링: 지원하지 않음
취소 가능: 지원하지 않음
이벤트 타입: MouseEvent
지원하는 HTML 태그: 모든 HTML 요소 중에서 <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> 및 <title>를 제외한 것들
DOM 버전： 레벨 2 이벤트

브라우저 지원

표에 나타난 숫자는 이 이벤트를 완전히 지원하는 첫 번째 브라우저 버전입니다.

이벤트 크롬 IE 파이어폭스 사파리 오페라
onmouseenter 30.0 5.5 지원 6.1 11.5
DOM 이벤트 MouseEvent