javascript - 使用jQuery鼠标悬停鼠标时链接的褪色颜色

Question

当您将鼠标悬停在 jQuery 中的链接上时，我试图实现一个很好的淡入淡出颜色效果。

到目前为止，我有：

$('a').hover(
function () { 
    $(this).animate({ color: '#fff' }, 1000 );
},
function () { 
    $(this).animate({ color: '#000' }, 1000 );
});

这实际上工作正常。但是，想象一下链接是否是导航，彼此靠近。如果您尝试从一个链接悬停到它旁边的链接并返回几次。链接在心理上淡入淡出，如果已经发生动画，我将如何阻止事件被“排队”？

任何建议表示赞赏！

Answer 1

您正在寻找stop功能

$('a').hover(
    function () { 
        $(this).stop().animate({ color: '#fff' }, 1000 );
    },
    function () { 
        $(this).stop().animate({ color: '#000' }, 1000 );
    }
);