Question

似乎jquery悬停（可能是潜在的浏览器事件）无法可靠地用于跟踪涉及动画时鼠标所在的元素，因为如果元素移动到或远离鼠标（而不是鼠标移动到元素中）。

有关我遇到的问题的示例，请参阅此fiddle。如果将鼠标悬停在div上，根据悬停跟踪事件的状态总是不同意现实，至少在动画结束时。

我没有在外部测试过Chrome，但我假设浏览器的行为相同。

HTML：

<div>hover me</div>
<p>state</p>

CSS：

div {
    -ms-transition: -ms-transform 1s;
    -webkit-transition: -webkit-transform 1s;
    transition: transform 1s;
}
div:hover {
    position: relative;
    -ms-transform: translateX(200px);
    -webkit-transform: translateX(200px);
    transform: translateX(200px);
}

JavaScript的：

$('div').hover(function() {
    $('p').text('over');
}, function() {
    $('p').text('out');
});

虽然小提琴不是一个现实的例子，但我在带有动画的网页中遇到了这个问题。我的问题是如何确保我的javascript正确知道动画后的悬停状态？我想这样做，没有跟随鼠标的全局mousemove事件（即，我可以在每个动画结束时的最后一个坐标下查找元素。）

在JavaScript中使用动画进行可靠的悬停检测？

0 个答案: