最新的Web開發教程
 

MouseEvent clientX Property

<事件對象

輸出當鼠標按鈕被點擊的元件上的鼠標指針的坐標:

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"下面的例子。


定義和用法

所述clientX屬性返回水平坐標(according to the client area)當鼠標事件被觸發鼠標指針的。

客戶區是當前窗口。

提示:要獲得縱坐標(根據客戶區),鼠標指針,使用clientY屬性。

注:此屬性是只讀的。


瀏覽器支持

屬性
clientX

句法

event .clientX

技術細節

返回值: 鼠標指針的一個數字,表示水平坐標,以像素為單位
DOM版本: 2級DOM事件

例子

更多示例

輸出,同時在一個元素上鼠標指針移動鼠標指針的坐標:

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 clientY Property

HTML DOM參考: MouseEvent screenX Property

HTML DOM參考: MouseEvent screenY Property


<事件對象