html：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div style="text-align: center;display: inline-block;margin: 50px;" id="demo" onmousemove="DisplayCoord(event)">
<img src="2021-03-27_161131.png" >
</div>
当前鼠标坐标为：
X：<span id="mp_x"></span>
Y：<span id="mp_y"></span>
<script type="text/javascript">
function DisplayCoord(event){
var oDiv,img_w,img_h;
oDiv=document.getElementById("demo");
img_w = oDiv.offsetWidth;
img_h = oDiv.offsetHeight;
document.getElementById("mp_x").innerHTML = parseInt(( ( event.offsetX ) / img_w) *100) +"%";
document.getElementById("mp_y").innerHTML = parseInt(( ( event.offsetY) / img_h)*100) +"%";
}
</script>
</body>
</html>
