Jquery 悬停延迟

发布于 2024-08-02 14:31:04 字数 542 浏览 4 评论 0原文

时一个悬停在图像上。封面淡入。我使用 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 秒。有什么想法吗？

原文

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

when one hovers over an image .cover is faded in. I use jquery to change the opacity because CSS doesn't work in IE for this purpose.

My code is:

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



    });
});

I want the fade in to be instant, not wait 1 second. Any ideas?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

辞别 2024-08-09 14:31:04

您有两个不同的动画按顺序发生：第一个是 .animate({ opacity: 0.7 }, 300) 和第二个 .fadeIn(300)。由于这些是竞争效应，因此让它们同时运行可能没有任何帮助。

如果 .fadeIn() 可以满足您的要求，请尝试使用它：

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

You have two different animations happening sequentially: first, .animate({ opacity: 0.7 }, 300) and second .fadeIn(300). Since those are competing effects, it's probably not helping anything to have them both running.

If .fadeIn() will do what you want, try just using that:

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

回复收藏 0 原文

~没有更多了~