jQuery在淡入之前淡出

Question

我正在製作我的投資組合，完全基於JavaScript。 http://portfolio.theadamgaskins.com/Portfolio/

我的問題是，當您單擊其中一個導航按鈕時，新頁面會在另一頁面淡出的同時淡入。在新頁面淡入之前，當前頁面應該淡出。下面是我正在使用的代碼：

$("#homeButton").click(function() 
    { 
     $('.page[id!="homePage"]').fadeOut('400', function() 
     { 
      $("#homePage").fadeIn('400'); 
     }); 
    }); 

這是斷章取義的;請隨時致電View Source。

Answer 1

發生這種情況是因爲某些元素已隱藏，所以它們的回調立即執行...導致您的同步動畫。爲了解決這個問題添加:visible你要動畫元素的選擇，這樣的：

$("#homeButton").click(function() { 
    $('.page[id!="homePage"]:visible').fadeOut('400', function() { 
     $("#homePage").fadeIn('400'); 
    }); 
}); 

這樣，你不重視動畫或有問題的回調是已經隱藏的元素。