html什么代码确定x坐标,HTML MouseEvent offsetX用法及代码示例

MouseEvent offsetX属性是一个只读属性，用于返回鼠标指针相对于目标元素的x坐标。

用法:

event.offsetX

返回值：它返回一个数字，该数字表示鼠标指针的水平坐标，以像素为单位。

以下示例程序旨在说明MouseEvent offsetX属性：

例：找出鼠标指针相对于

元素的水平坐标。MouseEvent offsetX Property in HTML

div {

border:3px solid green;

height:100px;

width:500px;

}

h1 {

color:green;

}

h2 {

font-family:Impact;

}

body {

text-align:center;

}

GeeksforGeeks

MouseEvent offsetX Property

Click inside the green box to get

the x-coordinate relative to the top edge.

The x-coordinate, relative to

the top edge of the DIV element is:

function coord(event) {

var c = event.offsetX;

document.getElementById(

"test").innerHTML = c;

}

输出：

单击按钮后：

单击按钮后：

支持的浏览器：

Opera

IE浏览器

谷歌浏览器

Firefox

苹果Safari