跟踪鼠标移动

Question

这应该是相对容易的，我想要追踪鼠标移动。我能够捕捉到鼠标的XY坐标。

但是，据我所知，这将根据浏览器大小而异，是吗？

如果是这样，有人可以推荐其他需要追踪的内容以确保我的结果准确吗？

附注：我正在使用以下JQuery示例：

$("html").mousemove(function(e){
var pageCoords = "( " + e.pageX + ", " + e.pageY + " )";
var clientCoords = "( " + e.clientX + ", " + e.clientY + " )";
$("span:first").text("( e.pageX, e.pageY ) - " + pageCoords);
$("span:last").text("( e.clientX, e.clientY ) - " + clientCoords);
});

- Steve

---

你面临的问题会受不同页面大小的影响吗？ - Robert Beuligmann

如果OP想要追踪鼠标移动，较大的浏览器窗口将导致更大的x值，如果页面内容是居中的。 - Dutchie432

PS：制作了一个演示：http://fiddle.jshell.net/t2AG2/6/show/ - Tanner Ottinger

Answer 1

坐标与浏览器大小无关。

希望这可以帮到你。祝好！

附注：使用 $(window).mousemove 或 $(document).mousemove 代替 $("html").mousemove，这是更好的实践方法。

- Edgar Villegas Alvarado

---

但是例如，如果有人在800x600的浏览器屏幕上并向下滚动页面，那么尺寸是否不会代表滚动后浏览器当前的页面视图？ - Steve

pageY 给出了鼠标相对于文档原点的位置，因此如果鼠标在文档顶部以下 200 像素处，用户向下滚动 100，则鼠标现在将位于 300 处。 - jasongetsdown

clientY 给出的是鼠标相对于浏览器视口的位置，因此当页面滚动时不会改变。通常情况下，您需要使用 pageY，因为它报告了鼠标相对于您的内容的位置。更多信息请参见 https://developer.mozilla.org/en/DOM/event.pageY 和 https://developer.mozilla.org/en/DOM/event.clientY。 - jasongetsdown