Question

我正试图找到一种方法来延迟悬停的评估或以下的替代解决方案：

我有动态生成的类名的元素。那些具有相同类别的人在盘旋时保持不透明，其他人改变不透明度。我在这里创建了一个示例：http://jsfiddle.net/g7JeQ/。

问题是，只要鼠标将一个元素留给下一个元素，其他不透明度就会立即恢复，从而产生闪烁效果。（即1,2,3具有相同的等级，并且4,5,6具有相同的等级。我想在同一类中的元素之间移动时消除这种闪烁）

如果有人能帮助我，我将非常感激。

Answer 1

您需要使用stop()停止上一个动画：

$('span').hover(function() {
    var theClass = $(this).attr('class');
    $('span:not(.' + theClass + ')').stop().animate({'opacity': 0.2}, 100);
}, function() {
    $('span').stop().animate({'opacity': 1}, 100); //restore all spans to 100% opacity
});

http://jsfiddle.net/g7JeQ/1/

Answer 2

在每个.animate（）

之前添加.stop（）

http://jsfiddle.net/g7JeQ/2/

jQuery悬停状态 - 延迟评估

2 个答案: