mouseover 事件时的鼠标位置答案

【问题标题】：Mouse position on mouseover eventmouseover 事件时的鼠标位置
【发布时间】：2013-01-10 19:45:00
【问题描述】：

是否可以在图像的 mouseouver 事件中获得准确的鼠标位置？如果我在文档鼠标移动事件中使用更新鼠标位置的函数，我可能会遇到延迟和此类问题，并且无法获得确切的位置。

【问题讨论】：

我认为您必须详细说明，并且一些示例代码也可能很好。我们是在谈论 Java 还是 JavaScript/Web？
JavaScript，这就是我要说的

标签： javascript mouse mouseover mouse-position

【解决方案1】：

如果你正在寻找一个简单的 JS 来获取 MouseOver 事件的光标位置，这里是示例代码：

    <!DOCTYPE html>
    <html>
    <head>
    	<script>
    	
    	function getPos(e){
    		x=e.clientX;
    		y=e.clientY;
    		cursor="Your Mouse Position Is : " + x + " and " + y ;
    		document.getElementById("displayArea").innerHTML=cursor
    	}
    
    	function stopTracking(){
    		document.getElementById("displayArea").innerHTML="";
    	}
    
    	</script>
    </head>
    
    <body>
    	<div id="focusArea" onmousemove="getPos(event)" onmouseout="stopTracking()"><p>Mouse Over This Text And Get The Cursor Position!</p></div>
    	
    	<p id="displayArea"></p>
    </body>
    </html>

【讨论】：

带定时器可能会更好（尤其是 CPU）
似乎对于鼠标悬停事件，clientX 和 clientY 是未定义的
不能得到小于8px的值，最大尺寸可以选择超过100%宽度...

【解决方案2】：

用于跟踪位置的javascript方法offset()，在这里我做了和Mayur说的一样的，只是添加了一点。

See jsfiddle

【讨论】：