ตัวอย่าง
ขาออกพิกัดของตัวชี้เมาส์เมื่อกดปุ่มเมาส์คลิกองค์ประกอบนี้:
var x = event.clientX; // Get the horizontal coordinate
var
y = event.clientY; // Get the vertical coordinate
var coor = "X coords: "
+ x + ", Y coords: " + y;
ผลจากการ coor อาจจะ:
X coords: 142, Y coords: 99
ลองตัวเอง» เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง
ความหมายและการใช้งาน
คุณสมบัติ clientY ส่งกลับแนวประสานงาน (according to the client area) ของตัวชี้เมาส์เมื่อเหตุการณ์เมาส์ถูกเรียก
พื้นที่ของลูกค้าคือหน้าต่างปัจจุบัน
เคล็ดลับ: การได้รับการประสานงานในแนวนอน (ตามพื้นที่ของลูกค้า) ของตัวชี้เมาส์ใช้ clientX คุณสมบัติ
หมายเหตุ: คุณสมบัตินี้ถูกอ่านอย่างเดียว
สนับสนุนเบราว์เซอร์
คุณสมบัติ | |||||
---|---|---|---|---|---|
clientY | ใช่ | ใช่ | ใช่ | ใช่ | ใช่ |
วากยสัมพันธ์
event .clientY
รายละเอียดทางเทคนิค
กลับค่า: | จำนวนคิดเป็นแนวตั้งพิกัดของตัวชี้เมาส์พิกเซล |
---|---|
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 clientX Property
อ้างอิง HTML DOM: MouseEvent screenX Property
อ้างอิง HTML DOM: MouseEvent screenY Property
<object เหตุการณ์