当我悬停时，淡入淡出效果不断重复

Question

当我将鼠标悬停在两个 div 上时，我正在使用淡入淡出效果来隐藏和显示它们。唯一的问题是，当我将鼠标悬停在它上面时，动画会不断重复多次，即使这是偶然的，而且有点烦人。

我使用 .stop(true, false) 方法制作动画。

像这样：

$('.fallInspiration').hover(
   function(){
      $(this).stop(true, false).animate({color: '#D55E8E'}, 300);
},

但我不知道如何解决使用淡入淡出效果时的问题。

这是我正在使用的代码：

$('.thisWeekWrap').hover(
    function()
    {
        $('.thisWeek').fadeOut(400);
        $('.thisWeekHover').fadeIn(400);
    },
    function()
    {
        $('.thisWeek').fadeIn(400);
        $('.thisWeekHover').fadeOut(400);
    }
);

非常感谢您的帮助。谢谢

Answer 1

您回答了自己的问题：在制作效果之前致电.stop()：

$('.thisWeek').stop().fadeOut( 400 )

如果这会导致问题（有时 jQuery 可能会“保存”已停止的值），请尝试：

$('.thisWeek').stop().animate({ opacity : 0 }, 400);