예
출력 마우스 버튼 요소에 클릭 마우스 포인터의 좌표 :
var x = event.clientX; // Get the horizontal coordinate
var
y = event.clientY; // Get the vertical coordinate
var coor = "X coords: "
+ x + ", Y coords: " + y;
좌표 데이터 로거의 결과가 될 수있다 :
X coords: 142, Y coords: 99 »그것을 자신을 시도 더 "Try it Yourself" 아래의 예.
정의 및 사용
는 clientX 속성은 수평 좌표를 리턴 (according to the client area) 마우스 이벤트가 트리거 될 때 마우스 포인터.
클라이언트 영역은 현재 창입니다.
팁 : 마우스 포인터의 (클라이언트 영역에 따라) 수직 좌표를 얻을 사용 clientY로의 속성을.
참고 :이 속성은 읽기 전용입니다.
브라우저 지원
| 재산 | |||||
|---|---|---|---|---|---|
| clientX | 예 | 예 | 예 | 예 | 예 |
통사론
event .clientX
기술적 세부 사항
| 반환 값 : | 수평을 대표하는 숫자 (픽셀), 마우스 포인터의 좌표 |
|---|---|
| DOM 버전 : | DOM 레벨 2 이벤트 |
더 예
예
출력 요소 위에 마우스 포인터를 이동하는 동안 마우스 포인터의 좌표 :
var x = event.clientX;
var y = event.clientY;
var coor = "X coords: "
+ x + ", Y coords: " + y;
document.getElementById("demo").innerHTML = coor;
»그것을 자신을 시도 예
는 clientX와 clientY로하고 screenX와 screenY의 차이 데모 :
var cX = event.clientX;
var sX = event.screenX;
var cY =
event.clientY;
var sY = event.screenY;
var coords1 = "client - X: " +
cX + ", Y coords: " + cY;
var coords2 = "screen - X: " + sX + ", Y
coords: " + sY;
»그것을 자신을 시도 관련 페이지
HTML DOM 참조 : MouseEvent clientY Property
HTML DOM 참조 : MouseEvent screenX Property
HTML DOM 참조 : MouseEvent screenY Property
<이벤트 객체