jQuery排队动画

Question

我有三张图片并使用下面的代码然后淡出鼠标翻转。 （他们都是他们自己的班级'拇指'）

$(".thumbs img").fadeTo("slow", 0.3);

$(".thumbs img").hover(function(){
    $(this).fadeTo("normal", 1.0);
},function(){
    $(this).fadeTo("slow", 0.3);
});

问题在于，当你将鼠标悬停在它们上几次并且它们会在那里闪烁时间长时间闪烁，因为每当你将鼠标滚动到一个上面时，它就会将效果添加到某种队列中。它发生时看起来很乱，有什么办法可以防止这种情况吗？

Answer 1

防止这种情况的最佳方法是在开始动画之前添加一个Stop（）。因此，您的代码将如下所示：

$(".thumbs img").stop().fadeTo("slow", 0.3);

$(".thumbs img").hover(function(){
    $(this).stop().fadeTo("normal", 1.0);
},function(){
    $(this).stop().fadeTo("slow", 0.3);
});