Safari/Chrome浏览器中的鼠标悬停鼠标移出问题

bxjv4tth  于 2023-03-21  发布在  Go
关注(0)|答案(2)|浏览(338)

这是一个奇怪的问题,我很震惊我以前从来没有注意到它。它的工作原理是这样的,如果你的鼠标是静止的,一个div在你的鼠标下编程移动,一个mouseover事件将不会在Chrome/Safari中触发-mouseout也是如此。当然,如果你稍微移动你的鼠标,一旦div在你的鼠标下移动,它将按预期工作。
我创建了一个demo on jsFiddle。只要让div在你的鼠标下振荡,在Firefox中工作正常,而不是在Chrome或Safari中-还没有在IE中测试。
我倾向于使用这个解决方案...基本上就是使用这个来滚动我自己的mouseentermouseleave事件:

if (mouseX > divLeft && mouseX < divRight &&
    mouseY > divTop && mouseY < divBottom){
    // mouse is inside div
}
  • 我说mouseenter然后离开,因为这个方法没有冒泡 *

我想知道是否有人对此有想法......我有一种感觉,有一个简单的方法绕过它,但到目前为止,谷歌还没有发现任何东西。

bvpmtnay

bvpmtnay2#

这种情况在Safari上似乎还在继续发生。我的解决方法是使用css。即使mouseover不会被触发,:hover:not(:hover) css伪元素也能工作。所以,如果你想在悬停时做的事情可以通过css实现,比如隐藏/显示一个元素,这是一个可行的解决方案。

相关问题