onmouseover 이벤트

DOM 이벤트 MouseEvent

정의와 사용법

onmouseover 이벤트는 마우스 포인터가 요소나 그 자식 요소에 이동할 때 발생합니다.

추천:이 이벤트는 일반적으로 onmouseout 이벤트함께 사용할 때, 사용자가 요소에서 마우스 포인터를 나가면 이 이벤트가 발생합니다.

예제

예제 1

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

<img onmouseover="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에서:

<element onmouseover="myScript">

본인이 직접 시도해 보세요

JavaScript에서:

object.onmouseover = function(){myScript};

본인이 직접 시도해 보세요

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

object.addEventListener("mouseover", myScript);

본인이 직접 시도해 보세요

주의사항:Internet Explorer 8 이상 버전에서는 지원되지 않습니다. addEventListener() 메서드。

기술적인 세부 사항

버블링: 지원
취소 가능: 지원
이벤트 유형: MouseEvent
지원되는 HTML 태그: 모든 HTML 요소 중에서는 <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> 및 <title>를 제외한 모든 요소가 있습니다.
DOM 버전: 레벨 2 이벤트

브라우저 지원

이벤트 크롬 IE 파이어폭스 사파리 오페라
onmouseover 지원 지원 지원 지원 지원
DOM 이벤트 MouseEvent