Question

我在我的投资组合网站中使用悬停效果，当你在盒子之间来回走动时，它会很有趣。任何想法如何解决它？

<script>
    jQuery(document).ready(function(e) {
        jQuery(".website a").hover(function() {
            jQuery(".website a").not(this).animate({ opacity: 0.4}); 
        }, function() {
            jQuery(".website a").animate({opacity: 1});
        });

    });

</script>

Answer 1

通过应用jQuery的.stop()方法看起来就可以了。在调用stop(true, true)方法之前进行animate方法调用。因此，在制作新动画之前，当前正在运行的动画已停止。

jQuery(document).ready(function (e) {
    jQuery(".website a").hover(function () {
        jQuery(".website a").not(this).stop(true, true).animate({
            opacity: 0.4
        });
    }, function () {
        jQuery(".website a").stop(true, true).animate({
            opacity: 1
        });
    });

});

true方法调用中的第一个stop(true, true)参数是一个布尔值，指示是否也要删除排队的动画。第二个参数是一个布尔值，指示是否立即完成当前动画。两者都默认为false。

Fiddle

悬停效果修复

1 个答案: