你需要使用一個回調的.fadeOut()，這是語法：
$(divToHide).fadeOut(400, function() {
$(divToShow).fadeIn();
});
這僅適用於（順利）如果功能只調用一次 - 在可見的元素。所以，最好的辦法是找到可見DIV和目標只是一個，而不是針對所有的-details的div：
var visibleDiv = $('.nav ~ div').filter(function() { return $(this).is(':visible'); });
然後回調看起來像這樣：
$(visibleDiv).stop().fadeOut(400, function() {
$(divToShow).fadeIn();
});
我d還加入.stop()以防止多重淡入淡出。
另外，值得注意的是，這是可行的，無需爲每個鏈接創建不同的功能。只需使用類似的東西：
$('.nav a').click(function(event) {
var currentElement = $(event.currentTarget);
var divToShow = $(currentElement).attr('id').replace('link', 'details');
....
});
要獲得div，您需要顯示從任何鏈接單擊。因此，所有一起jQuery的樣子：
$('.nav a').click(function(event) {
var currentElement = $(event.currentTarget);
var divToShow = $(currentElement).attr('id').replace('link', 'details');
var visibleDiv = $('.nav ~ div').filter(function() { return $(this).is(':visible'); });
if (visibleDiv.length) // if there is a div already visible, fade it out then fade in the target div
{
$(visibleDiv).stop().fadeOut(400, function() {
$('#' + divToShow).fadeIn();
});
}
else $('#' + divToShow).fadeIn(); // fade it in.
});
我還補充說，if語句，因此有在第一個div褪色沒有延遲。
JSFiddle Here。希望這可以幫助！
這效果很好！唯一不起作用的是我的滾動到錨點（這是一個單獨的腳本，我在我的網站的其餘部分使用了獨立的腳本，從這裏取得：http://css-tricks.com/snippets/jquery/smooth-滾動/）。每個項目鏈接都有一個href =「project-1-details」屬性，應該引起滾動到錨定功能。如果項目1的細節已經可見，並且我點擊了項目1鏈接，這個滾動到錨點的腳本運行良好。但它不會在第一次點擊時滾動。我將如何去添加額外的功能？ –
@EricWood我沒有看到代碼就說不出來。關掉我的頭頂，也許會在你淡入目標後觸發'project-link''''標籤的第二次點擊。正如在這個小提琴：http://jsfiddle.net/ERP7L/12/ – bowheart
你可以看到這個問題在這裏播放：http://jsfiddle.net/ERP7L/14/ - 第二次你點擊鏈接，你會得到我正在尋找的行動。我還向關閉按鈕添加了相同的腳本，因此它將您滑回到導航部分，並且這似乎工作得很好。我還專門針對js中的＃project-1-details等div，以便頁面上的其他div不受影響。我確實找到了一種方法來添加該函數（請參閱http://jsfiddle.net/ERP7L/15/），但有時它會有點矮胖，直到div已經淡入，纔會滑動。 –