JAVASCRIPT

javascript mouse이벤트

웹개발자준비 2018. 11. 6. 18:14

마우스 사용할때 발생하는 이벤트

1. onmouseover : 해당 객체의 영역 위에 커서가 진입하는 순간 발생

2. onmouseout : 해당 객체의 영역에서 커서가 빠져나가는 순간 발생

3. onmousedown : 해당 객체의 영역에서 마우스 버튼이 눌려지는 순간 발생

4. onmouseup : 해당 객체의 영역에서 마우스 버튼이 뗄때 순간 발생

5. onmousemove : 해당 객체의 영역에서 커서가 움직이는 순간 발생



//어느 버튼을 사용했는지?

event 객체 <event.buttons>

- 이벤트에 의해서 호출되는 함수에서 사용하는 예약어

- 발생한 사건의 여러가지 정보를 제공 객체


event.buttons == 1 왼쪽버튼

event.buttons == 2 오른쪽버튼


마우스 포인터 좌표


1. x,y (비권장)

- 문서 좌측 상단을 기준점

- 비표준


2. clientX, clientY (권장)

- 문서 좌측 상단을 기준점

- 표준

- 많이 사용한다.


3. screenX, screenY

- 모니터 화면의 좌측 상단을 기준점

- 잘 안쓴다.


4. offsetX, offsetY

- 이벤트 발생한 객체(태그)의 좌측 상단을 기준점

- 많이 사용한다.