Thuộc tính MouseEvent clientY

Sự kiện DOM MouseEvent

Định nghĩa và cách sử dụng

Khi sự kiện chuột được kích hoạt, thuộc tính clientY trả về tọa độ thẳng đứng của con trỏ chuột (theo khu vực khách hàng).

Khu vực khách hàng là cửa sổ hiện tại.

Lưu ý:Để lấy tọa độ ngang của con trỏ chuột (theo khu vực khách hàng), hãy sử dụng Thuộc tính clientX.

Ghi chú:Thuộc tính này chỉ đọc.

Mẫu

Ví dụ 1

Khi nhấn nút chuột trên phần tử, hiển thị tọa độ con trỏ chuột:

var x = event.clientX;     // Lấy tọa độ ngang
var y = event.clientY;     // Lấy tọa độ thẳng đứng
var coor = "X coords: " + x + ", Y coords: " + y;

Kết quả là:

X coords: 142, Y coords: 99

Thử trực tiếp

Ví dụ 2

Khi con trỏ chuột di chuyển trên phần tử, hiển thị tọa độ con trỏ chuột:

var x = event.clientX;
var y = event.clientY; 
var coor = "X coords: " + x + ", Y coords: " + y;
document.getElementById("demo").innerHTML = coor;

Thử trực tiếp

Ví dụ 3

Giải thích sự khác biệt giữa clientX và clientY và screenX và 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;

Thử trực tiếp

Cú pháp

event.clientY

Chi tiết kỹ thuật

Giá trị trả về: Giá trị số, biểu thị tọa độ thẳng đứng của con trỏ chuột, tính theo pixel.
DOM phiên bản: DOM Level 2 Events

Hỗ trợ trình duyệt

Thuộc tính Chrome IE Firefox Safari Opera
clientY Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ

Trang liên quan

Tài liệu tham khảo HTML DOM:Thuộc tính clientX của MouseEvent

Tài liệu tham khảo HTML DOM:Thuộc tính screenX của MouseEvent

Tài liệu tham khảo HTML DOM:Thuộc tính screenY của MouseEvent

Tài liệu tham khảo HTML DOM:Thuộc tính offsetX của MouseEvent

Tài liệu tham khảo HTML DOM:Thuộc tính offsetY của MouseEvent

Sự kiện DOM MouseEvent