animate（）の後にhide（）jquery animate関数が設定されていると、動作しません。

Question

まず私はアニメイトidは、「テスト」、その後

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

私はMacOSの中のように近い効果を作り、それをアニメーション化し、それを隠したいです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(); 
     }); 

hideに設定opacityjsFiddleすぎ

Answer 2

にあなたのためにこれを保存し、それが動作します：

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

});