Thuộc tính event.pageY
Thuộc tính event.pageY chứa tọa độ của
con trỏ chuột theo trục Y.
Để xác định tọa độ cũng có các thuộc tính
event.clientX,
event.clientY,
event.pageX.
Hãy xem sự khác biệt giữa clientX/clientY
và pageX/pageY.
Cách clientX và clientY hoạt động:
nếu bạn có một cửa sổ 1000 x 1000
pixel và con trỏ chuột nằm ở giữa, thì clientX
và clientY sẽ đều bằng 500. Nếu
bạn sau đó cuộn trang theo chiều ngang
hoặc dọc mà không di chuyển con trỏ, thì các giá trị
clientX và clientY sẽ không thay đổi, vì chúng được tính
tương đối so với cửa sổ, không phải tài liệu.
Cách pageX và pageY hoạt động:
nếu bạn có một cửa sổ 1000 x 1000
pixel và con trỏ chuột nằm ở giữa, thì
pageX và pageY sẽ bằng 500. Nếu
bạn sau đó cuộn trang xuống 250
pixel, thì pageY sẽ trở thành 750.
Như vậy pageX và pageY chứa tọa độ
sự kiện có tính đến việc cuộn trang.
Cú pháp
event.pageY;
Ví dụ
Khi di chuyển chuột trên trang, chúng ta sẽ hiển thị
tọa độ của nó tương đối với cửa sổ trình duyệt
(pageX và pageY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.pageX + ' : ' + event.pageY;
});
:
