使用傳輸js和jQuery時，回調完整函數無法正常工作。

Question

所以

我想建立使用jquery transit

一些導航的打開/向下滑動導航工作正常。它將ul設置爲顯示塊，然後運行動畫/轉換。

關閉導航項目時發生此問題。儘管在回調中寫入，ul立即隱藏起來。一旦轉換完成，我還添加了「動畫結束」的控制檯日誌，並且這是在正確的時間點擊，因此不確定爲什麼ul會立即隱藏。

了jQuery/JS是這樣的：

var dropDown = (function(){ 

    var mainNav   = $('#mainNav'); 
    var navA   = mainNav.find('li a'); 
    var navUL   = mainNav.find('ul'); 
    var iconAll   = mainNav.find('i'); 
    navUL.transition({ 
     'max-height': '0px', 
     'height':  '0px', 
     'overflow':  'hidden', 
     'display':  'none' 
    }); 
    navA.on('click',function(){ 
     var nextUL   = $(this).next(); 
     var icon   = $(this).find('i'); 
     var nextULHidden = nextUL.css('display') === 'none'; 
     if(nextULHidden) { 
      nextUL.css('display','block').transition({ 
       duration:  1000, 
       'height':  'auto', 
       'max-height': '1000px', 
       easing:   'ease-in' 
      }); 
      $(this).addClass('active'); 
      icon.removeClass('fa-chevron-down').addClass('fa-chevron-up'); 
      console.log('hidden'); 
     }else if(!nextULHidden){ 
      nextUL.transition({ 
       duration:  1000, 
       'height':  '0px', 
       'max-height': '0px', 
       easing:   'ease-in', 
       complete: function(){ 
        nextUL.css('display','none'); 
        console.log('animation ended'); 
       } 
      }); 
      $(this).removeClass('active'); 
      icon.removeClass('fa-chevron-up').addClass('fa-chevron-down'); 
      console.log('visible'); 
     }else{ 
      console.log('some error'); 
     } 
     return false; 
    }); 

}()); 

而且我這裏有一個小提琴，可以與被修修補補：http://jsfiddle.net/lharby/o5w8ebu8/2/

我試着使用CSS的可視性，jQuery的節目的各種組合（ ）和hide（）函數，但每當ul過渡開始時（在有效點擊時）ul消失。我已經測試過Chrome，Firefox和Safari，以防有任何異常情況發生。

Answer 1

我相信回調是在正確的時間（1000毫秒後）發射問題是過渡動畫不起作用。

更改爲'height': 'auto'上的縮小過渡似乎達到了你以後的效果。雖然我不能說我真的知道爲什麼。