Safari/Chrome 中的 MouseOver MouseOut 问题

Question

这很奇怪，我很震惊我以前从未注意到它。它是这样工作的，如果你的鼠标静止不动并且一个 div 以编程方式移动到你的鼠标下方，则不会在 Chrome/Safari 中触发

mouseover

事件 -

mouseout

也是如此。当然，如果您在 div 移动到鼠标下方后稍微移动鼠标，它将按预期工作。

我在 jsFiddle 上创建了一个demo。只需让 div 在您的鼠标下振荡，在 Firefox 中运行良好，在 Chrome 或 Safari 中运行不正常 - 尚未在 IE 中进行测试。

我倾向于这个解决方案......基本上使用这个滚动我自己的

mouseenter

和

mouseleave

事件：

if (mouseX > divLeft && mouseX < divRight &&
    mouseY > divTop && mouseY < divBottom){
    // mouse is inside div
}

我说

mouseenter

然后离开，因为这种方法不会冒泡

我想知道是否还有其他人对此有想法......我觉得有一种简单的方法可以解决它，但到目前为止谷歌还没有发现任何问题。

Answer 1

你可能会发现这个错误很有趣。

Answer 2

这似乎在 Safari 上继续发生。我寻求的解决方法是使用 css 。即使

mouseover

不会被触发，

:hover

或

:not(:hover)

css 伪元素也可以工作。所以，如果你想在悬停时做的事情通过 css 是适用的，比如隐藏/显示一个元素，这是一个可行的解决方案。