javascript - Jquery Hover 延迟

Question

http://wesbos.com/tf/shutterflow/?cat=3

当一个人悬停在图像上时，.cover 会淡入。我使用 jquery 来更改不透明度，因为 CSS 在 IE 中不能用于此目的。

我的代码是：

$(document).ready(function () {
    $('.slide').hover(function () {
        $(".cover").animate({
            opacity: 0.7
        }, 300).fadeIn('300');
    }, function () {
        $(".cover").animate({
            opacity: 0
        }, 300).fadeOut('300');



    });
});

我希望淡入是即时的，而不是等待 1 秒。有任何想法吗？

Answer 1

您有两个不同的动画顺序发生： first.animate({ opacity: 0.7 }, 300)和 second .fadeIn(300)。由于这些是相互竞争的效果，因此让它们同时运行可能无济于事。

如果.fadeIn()会做你想做的事，请尝试使用它：

$(document).ready(function() {
    $('.slide').hover(
        function() { $(".cover").fadeIn('300'); },
        function() { $(".cover").fadeOut('300'); }
    );
});