Question

我有一个div，我试图制作动画。 div有一个名为peek_up的动画类，我正在使用else / if添加动画，如果应用了peek_up则降低div，如果不是则引发它。我的问题是，即使应用了peek_up，我使用的类也会使peek_up类变得模糊不清。如何在完成后删除用于提升的动画？

$('#box').on('click', function() {
var $this = $(this);
if ($this.hasClass('peek_down')) {
$this.toggleClass('peek_down').toggleClass('bob_down');
}
else{ 
$this.toggleClass('close_up');
}
});

bob_down降低了div，close_up引发了它（并且这样做掩盖了peek_up）。这段代码是我收到的关闭。

http://jsfiddle.net/6sQU5/

Answer 1

你是用jQuery还是CSS3做动画？通过动画，你的意思是简单地切换课程吗？您需要发布完整的动画代码，以便人们能够理解您在此处尝试做的事情。

jQuery animate（）函数能够添加动画后回调函数，您可以使用它来实现所需的功能。例如：

$("#box").click(function() {
    $("#box").animate({
        top: "+=100"
    }, 5000, function() {
        // Post-animation callback function, add the required code here
    });
});

Answer 2

我设法让动画像我打算使用setTimeout函数一样运行，但由于某些原因它似乎没有转换为jsFiddle。它在我的浏览器中工作正常。

$('#box').on('click', function (){
var $this = $(this);
if ($this.hasClass('peek_down')){
    $this.removeClass('peek_down')
         .addClass('bob_down');
} else{
    $this.removeClass('bob_down')
         .addClass('close_up')
         .addClass('peek_down')
         setTimeout(function(){
    $this.removeClass('close_up')},600);
}
});

动画后删除类

2 个答案: