javascript - 鼠标移动太快时不会触发 Mouseover 和 mouseout 事件？

Question

我写了一个现场演示来展示这个问题：

http://cssdeck.com/labs/wcczap11

如果您在蓝色、红色和绿色区域之间快速移动鼠标，您将看到 x 和 z 日志之间没有出现红色的“y”日志，这意味着您无法获取红色区域的鼠标事件。

这就是我要的：

但是当鼠标移动太快时：

我只是想知道有没有一种方法，无论我移动鼠标的速度有多快，结果总是与第一张图像相同？

Answer 1

我不完全确定它是否会影响 javascript，但不同的鼠标有不同的轮询率（以 Hz 为单位），如果你的鼠标是 1000hz 并且你以恒定的速度移动 1000px，你应该拾取每个像素。

然而在现实中，当我们接近目标以提高准确性时，我们会非常快地开始移动鼠标并减慢速度。这意味着前 700ish 像素的移动速度将比 700hz 轮询的速度更快，因此您缺少鼠标在 1hz 中移动超过 1px 的值。

这有点像一个愚蠢的版本（主要是因为我对它一无所知）但基本上小目标很容易被鼠标事件错过。

您可以尝试使目标区域更大，但它仍然无法解决所有问题:)

Answer 2

这里的问题很简单。

这些事件并没有因此而“丢失”。它们从来没有真正触发过：由于传输的速度，浏览器在任何时候都不会将指针拾取为“结束”。如果是这样，那么它也不能触发“out”，因为它从一开始就没有被视为“in”。

Answer 3

它不会丢失。它来来去去，但你看不到，因为你移动鼠标太快了。在您的示例中，它并没有丢失。

Answer 4

调用执行时间过长的回调可能会导致浏览器跳过轮询，直到下一个轮询滴答声（你见过[Violation] 'message' handler took 326ms控制台消息吗？）。您正在使用 jQuery 附加事件处理程序（我对 jQuery 了解不多），因此事件处理程序有可能不是被动的。