Jquery 图像淡出

Question

我正在使用这个 jquery 来尝试淡出我的图像并显示下面的内容。它工作完美，除非您将鼠标悬停在它上面多次。然后它就吓坏了，开始一遍又一遍地进出。我能做点什么吗？

$('#contentPosters li').hover(function(){
    $(this).find('img').fadeOut();
}, 
function(){
    $(this).find('img').fadeIn();
});

Answer 1

$('#contentPosters li').hover(function(){
    $(this).find('img').stop().fadeTo('fast',0);
}, 
function(){
    $(this).find('img').stop().fadeTo('fast',1);
});

使用stop()和fadeTo

stop()用于停止当前动画。

fadeTo() 用法是因为当您在 fadeIn/fadeOut 期间停止动画时，不透明度不会重置为 100%，并且随着时间的推移，您的图像将变得不可见。