애니메이션 후 클래스 제거

Question

나는 애니메이션하려는 div가 있습니다. div에는 peek_up이 적용된 애니메이션 클래스가 있고 peek_up이 적용되면 div를 낮추는 애니메이션을 추가하려면 else/if를 사용하고 그렇지 않으면 raise를 사용합니다. 내 문제는 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는 close_up 그것을 제기, 사업부를 낮추고 (그렇게함으로써 peek_up 모호). 이 코드는 내가 작성한 휴관일입니다.

http://jsfiddle.net/6sQU5/

Answer 1

은 내가 몇 가지 이유가 jsFiddle로 번역하지 않는 것 같습니다 불구하고,의 setTimeout 기능을 사용하여 의도 한대로 애니메이션을 실행할 수있었습니다. 그것은 내 브라우저에서 잘 작동합니다.

$('#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); 
} 
}); 

Answer 2

당신은 jQuery를 또는 CSS3와 애니메이션을하고 있습니까? 애니메이션으로 단순히 수업을 토글하는 것을 의미합니까? 사람들이 여기서하려는 일을 이해할 수 있도록 전체 애니메이션 코드를 게시해야합니다.

jQuery animate() 함수에는 필요한 것을 얻기 위해 사용할 수있는 애니메이션 후 콜백 함수를 추가 할 수있는 기능이 있습니다. 예를 들어 :

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