有趣的问题:鼠标的绝对坐标,无论窗口大小

时间:2011-03-31 20:44:59

标签: javascript math mouseevent

这可能是一个数学问题而不是编程问题,但我们会看到。

我正在尝试构建一个简单的javascript点击跟踪器,可以将其添加到任何网站,这会将其数据绘制到热图上。

问题

如果我在1024x768的窗口中显示的网页上捕获点击事件的x / y坐标,并尝试将其映射到以1280x1024(或任何其他尺寸)显示的热图上,那么&#39 ;很有可能点击不会显示在正确的位置。

例如,如果网页的内容居中在960像素宽的div中,因为从窗口左上角的原点捕获的x,y坐标是坐标,所以坐标不是在物理空间中匹配。

我可以使用两种屏幕尺寸之间的差异在所有屏幕的中心创建一个原点并从那里开始测量,但是对于任何相对于该屏幕没有定位的内容,我最终会遇到同样的问题。页面的中心。

有没有办法在页面上开发一组元素的绝对坐标,而不知道浏览器窗口的大小或页面上的内容?

我知道我可以将点击绑定到DOM元素。那很好,我可能会走那条路,但是现在我发现了这个问题,我对可能的解决方案很好奇。

1 个答案:

答案 0 :(得分:1)

jQuery x y document coordinates of DOM object描述了一个类似的问题并且有一个可能的解决方案。希望能够正确处理浏览器行为。

如果这不起作用,这个问题可能很难解决。有关Microsoft在几年前实施此功能的难度,请参阅http://weblogs.asp.net/bleroy/archive/2008/01/29/getting-absolute-coordinates-from-a-dom-element.aspx