hide() jquery animate 함수가 animate() 다음에 설정된 경우 작동하지 않습니까?

Question

먼저 나는 애니메이션 ID가 "테스트"다음

<iframe id="test" src=""></iframe> 

내가 맥 OS처럼 가까운 효과를 만들어, 그것을 애니메이션으로 숨길 할 수있는 iframe이 있습니다

$('#test').animate({ 
       'width':0, 
       'height':0, 
       'top':$('input').offset().top, 
       'left':$('input').offset().left 
      },function(){ 
       //$(this).hide();   
      }).hide(); 

을하지만 보인다 iframe을 숨길 수는 없습니다. 그러나 애니메이션에있는 콜백 함수 (위의 주석이 달린 코드)에 코드를 작성하면 다시 작동 할 수 있습니다.

Here is online case

그래서 궁금 왜 숨기기() 애니메이션()? 작동 내가 뭔가를 그리워하지 않는 후?

Answer 1

귀하의 질문에 대답하기 위해, (.animate() 실행 비동기) .hide()에 대한 호출이 .animate()에 대한 호출 후 즉시 을 수행되므로 .hide() 호출은 실제로 애니메이션이 완료, 전에 장소 소요 - jQuery를이 제공하는 이유는 콜백 함수를 사용하여 애니메이션 완료 시점을 사용자에게 알릴 수 있습니다.

$('#test').animate({ 'width':0, 'height':0, 'top':$('input').offset().top, 'left':$('input').offset().left }, function(){ $("#test").hide(); }); 

너무

Answer 2

이 hide에 opacity 설정 jsFiddle에 당신이 저장하고 작동합니다

$('#mask').click(function() {    
    $('#mask').fadeOut(500); 
    $('#test').animate({ 
     opacity: 'hide', 
     'top':$('input').offset().top, 
     'left':$('input').offset().left, 
    },3000); 

});