html鼠标悬停显示坐标,js如何在image标签上获取鼠标停留坐标位置页面案例

可以使用以下代码实现：

HTML：

<img src="example.jpg" onmousemove="showCoords(event)">
<div id="coords"></div>

JavaScript：

function showCoords(event) {
  var x = event.clientX;
  var y = event.clientY;
  var coords = "X: " + x + ", Y: " + y;
  document.getElementById("coords").innerHTML = coords;
}

解释：

1. 在`<img>`标签中添加`onmousemove`事件，并将其绑定到`showCoords(event)`函数。

2. `showCoords(event)`函数获取鼠标停留位置的横纵坐标。

3. 将坐标信息显示在页面上，可以通过`document.getElementById("coords")`获取`<div>`标签，并通过`innerHTML`属性更新其内容。