Javascript - 啓動功能，之前的功能已結束

Question

我試圖在前面的功能結束後啓動功能。 .SideArea div將顯示：none。在.sideShowing，#page動畫結束後，而是display：none部分被忽略。

繼承人我的代碼。

$(function(){ 
    $("#SideMenuButton").click(function() { 
     var SideArea = $(".SideArea"); 
     if (SideArea.css('display')!=='block') { 
      SideArea.css('display','block'); 
      var move = 260; 
      $(".sideShowing #page").stop().animate({left:"+="+move},{queue:false,duration:150}); 
      $("body, #viewport").css('min-height','600px').css('max-height','600px'); 
     } else { 
      $(".sideShowing #page").stop().animate({left:"0"},{queue:false,duration:150}, function() { 
       $(".SideArea").css('display','none')}); 

      $("body, #viewport").css('min-height','800px').css('max-height',''); 
     } 
    }); 
}); 

它是

$(".sideShowing #page").stop().animate({left:"0"},{queue:false,duration:150}, function() { 
       $(".SideArea").css('display','none')}); 

部分，其中顯示：無被忽略。我希望函數在以前的動畫函數結束時啓動，但不起作用。

我在做什麼錯？

Answer 1

使用此形式的animate()，complete回調被指定爲第二個參數（選項圖）的屬性，而不是第三個參數。

$(".sideShowing #page").stop().animate({left:"0"}, { 
    queue: false, 
    duration: 150, 
    complete: function() { 
     $SideArea.css('display','none'); 
    } 
});