최신 웹 개발 튜토리얼
 

MouseEvent pageX Property

<이벤트 객체

출력 마우스 버튼 요소에 클릭 마우스 포인터의 좌표 :

var x = event.pageX;     // Get the horizontal coordinate
var y = event.pageY;     // Get the vertical coordinate
var coor = "X coords: " + x + ", Y coords: " + y;

좌표 데이터 로거의 결과가 될 수있다 :

X coords: 162, Y coords: 40
»그것을 자신을 시도

"Try it Yourself" 아래의 예.


정의 및 사용

페이지 X 속성은 마우스 이벤트가 트리거 될 때 수평이 마우스 포인터의 (문서)에 따라 좌표를 반환합니다.

이 문서는 웹 페이지입니다.

팁 : 마우스 포인터의 (문서)에 따라 수직 좌표를 얻을 사용하여 페이지 Y의 속성을.

참고 :이 속성은 읽기 전용입니다.

참고 :이 속성은 비표준이지만, 대부분의 주요 브라우저에서 작동합니다.


브라우저 지원

재산
pageX 12.0

통사론

event .pageX

기술적 세부 사항

반환 값 : 수평을 대표하는 숫자 (픽셀), 마우스 포인터의 좌표
DOM 버전 : 없음

예

더 예

출력 요소 위에 마우스 포인터를 이동하는 동안 마우스 포인터의 좌표 :

var x = event.pageX;
var y = event.pageY; 
var coor = "X coords: " + x + ", Y coords: " + y;
document.getElementById("demo").innerHTML = coor;
»그것을 자신을 시도

는 clientX와 clientY로하고 screenX와 screenY의 차이 데모 :

var pX = event.pageX;
var cX = event.clientX;
var pY = event.pageY;
var cY = event.clientY;
var coords1 = "page - X: " + pX + ", Y coords: " + pY;
var coords2 = "client - X: " + cX + ", Y coords: " + cY;
»그것을 자신을 시도

관련 페이지

HTML DOM 참조 : MouseEvent pageY Property

HTML DOM 참조 : MouseEvent clientX Property

HTML DOM 참조 : MouseEvent clientY Property

HTML DOM 참조 : MouseEvent screenX Property

HTML DOM 참조 : MouseEvent screenY Property


<이벤트 객체