Question

我有一个BG图像动画，它依赖于hover回调来恢复原始状态。如果我在链接上快速移动鼠标，则悬停状态会发生。我的猜测是我在第一个动画完成之前将鼠标移开，因此回调不会注册。

是否有更灵活的方式来编写此功能？

$('.nav li a').hover(function() {
    $(this).addClass('hovered', 300);
}, function() {
    $(this).removeClass('hovered', 300);
});

（它使用BGimg plugin来支持add / removeClass上的speed参数）

可测试：McPherson Industries

Answer 1

这是一个常见的问题，无法解决，我担心 - 由浏览器来跟上事件，如果不能，那么，你运气不好。

但也可能是jQuery的错。很难说没有进入源代码。无论如何，有一个简单的解决方法：

$('.nav li a').hover(function() {
    // When element is hovered, remove hovered state from all elements..
    $('.hovered').removeClass('hovered');
    // ..and add it to this one.
    $(this).addClass('hovered', 300);
}, function() {
    // This is only needed when exiting an element and not enterin another one
    $(this).removeClass('hovered', 300);
});

这可能不是100％肯定，但它比你现在更好。

Answer 2

~~addClass方法中的300值是多少？它不需要两个参数..只有一个 Api参考：http://api.jquery.com/addClass/~~ （好的，注意到插件）

它对我来说很好..所有链接都恢复原来的图像，无论我移动鼠标的速度有多快..

<强> 更新

好的，我现在看到了问题..

Chrome正常（似乎唯一的一个...... ）
Firefox显示问题..
IE显示问题

更新2 在我看来问题是你使用的插件..它忽略了对同一对象的排队请求，直到当前动画结束。所以如果你在第一个完成之前将鼠标悬停，它将不会恢复正常。

对此我无能为力，抱歉..

如何确保我的事件总是在jQuery中激活？ [悬停回调未触发]

2 个答案: