Question

我有鼠标悬停和鼠标移动时的动画和淡入淡出但我不希望它们在div已被动画时触发。

这是我尝试的但是它无法正常工作（如果我鼠标悬停和鼠标移动它会变得疯狂）。

$('.hover-div').mouseover(function() {

        if ( ( $('.carousel-bg').not(':animated') ) && ( $('div.carousel-holder div.text').not(':animated') ) ) {

            $('div.hidden').fadeIn(1000);

            $('.carousel-bg').animate({
                'top': 0,
                'height': 360
            }, 200);

            $('div.carousel-holder div.text').animate({
                'top': 75
            });

        }

    });

    $('.hover-div').mouseout(function() {

        if ( ($('.carousel-bg').not(':animated')) && ($('div.carousel-holder div.text').not(':animated')) ) {

            $('div.hidden').hide();

            $('.carousel-bg').animate({
                'top': 112,
                'height': 130
            }, 200);

            $('div.carousel-holder div.text').animate({
                'top': 125
            });

        }

Answer 1

在这种情况下，我们使用stop()。

$('.carousel-bg').stop();

Answer 2

使用is()代替not()

if(!$('.carousel-bg').is(':animated') ....

阅读here以了解有关.is()

的更多信息

如果div已经动画，不要做动画

2 个答案: