Question

在用jQuery弄脏了两个星期之后，我认为这很棒，我学到了很多，但我无法确定是否有办法扭转动画。我正在谈论某种切换，但是对于更复杂的动画。

我知道在这种情况下我可以做fadeToggle，但是我指的是更复杂的情况，当你将鼠标悬停在一个div上时，多个动画会生效。

我是否必须像这样编写动画代码？

//animation
$(".box-1").on('mouseover', function(){
    $(this).find('.main-image').animate({
        'opacity': '0.2'
    });
});

//reversing the animation
$(".box-1").on('mouseout', function(){
    $(this).find('.main-image').animate({
        'opacity': '1'
    });
});

Answer 1

我不知道反向动画，但你可以使用jQueryUI为类添加和删除动画更好更容易。像这样：

$(".box-1").on('mouseover', function(){
    $(this).find('.main-image').addClass('over', 500);
});

$(".box-1").on('mouseout', function(){
    $(this).find('.main-image').removeClass('over', 500);
});

我在这里修改了你的代码： http://jsfiddle.net/Z6xd2/3/

在mouseout上反向运行动画

1 个答案: