Halimbawa ng MouseEvent clientX katangian

Definisyon at Paggamit

Kapag nangyari ang mouse event, ang clientX katangian ay ibibigay ang sukat ng mouse pointer sa paksiyento (ayon sa client area).

Ang client area ay ang kasalukuyang window.

Mga Payo:Upang makakuha ng sukat ng yari ng mouse pointer (ayon sa client area), gamitin ang: clientY 属性.

Komento:Ang katangian na ito ay readonly.

Eksemplo

Halimbawa 1

Ipalabas ang sukat ng mouse pointer kapag may click ang mouse button sa elemento:

var x = event.clientX;     // Makuha ang sukat ng paksiyento
var y = event.clientY;     // Makuha ang sukat ng yari
var coor = "X coords: " + x + ", Y coords: " + y;

Subukan Ngayon

Halimbawa 2

Ipalabas ang sukat ng mouse pointer kapag ang mouse pointer ay gumagalaw sa elemento:

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

Subukan Ngayon

Halimbawa 3

Ipinapakita ang pagkakaiba ng clientX at clientY at screenX at 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;

Subukan Ngayon

Mga Tagubilin

event.clientX

Detalye ng Teknolohiya

Halimbawa ng Bunga: Ang bilang na naglalagay ng lebel ng sukat ng mouse pointer sa paksiyento ng pixel.
DOM Versyon: DOM Level 2 Events

Suporta ng Browser

Atributo Chrome IE Firefox Safari Opera
clientX 支持 支持 支持 支持 支持

相关页面

HTML DOM 参考手册:MouseEvent clientY 属性

HTML DOM 参考手册:MouseEvent screenX 属性

HTML DOM 参考手册:MouseEvent screenY 属性

HTML DOM 参考手册:MouseEvent offsetX 属性

HTML DOM 参考手册:MouseEvent offsetY 属性