jquery：在fadeOut之前運行的函數完成

我遇到了jquery腳本的問題...應該是一件容易的事情，但有一些奇怪的行爲我無法弄清楚。jquery：在fadeOut之前運行的函數完成

當我點擊一個鏈接時，我希望我的內容消失，然後重新出現新的內容。所有內容都存儲在標籤中。

下面是我使用的是什麼：

$("#events_link").click(function() { 
    $("#content").children(".content").fadeOut(fadetime, function() { 
     $("#events").fadeIn(fadetime); 
    }); 
    return false 
});

然而，淡入不是等到內容已經淡出。

我的整個頁面在這裏（在一個頁面上的所有代碼/腳本）：

http://dl.dropbox.com/u/4217965/HorrorInTheHammer/index.html

有什麼想法？

來源

2010-08-24 MetalAdam

這將運行的.content_box元素...和隱藏的人的每一個將立即完成他們的動畫，所以你想是這樣的：

$("#events_link").click(function() { 
    $("#content > .content_box:visible").fadeOut(fadetime, function() { 
     $("#events").fadeIn(fadetime); 
    }); 
    return false 
});

最重要的變化是:visible selector，所以只可見的一個淡出......並觸發回調以顯示下一個。

來源

2010-08-24 17:52:37

完美。謝謝，尼克。 – MetalAdam 2010-08-24 18:21:39

謝謝。你是泰諾，我的頭痛長達1小時。 – Klikerko 2013-09-16 15:03:39

-2

你的網頁的當前版本不會出現在所有的工作，因爲你有類似

$("#content").children(".content")

，而不是

$('#content').children('.content_box')

修正了，它會更容易解決。 ..

EDIT（現在上面的修復完成）：

它看起來像fadeOut函數不像文檔中那樣工作，至少在Firefox 3.5中，就回調而言。我想你可能希望可以通過使用一個小平原歲的javascript來實現的：

$('#content').children('.content_box').fadeOut(fadetime); 
window.setTimeout(function() { $('#events').fadeIn(fadetime); }, fadetime + 100); 
return false;

我認爲，這將更有可能完成你想要通過努力確保舊的內容消失了什麼，不再實際上正在在淡入新內容之前騰出空間。讓我們都知道它是否適合你。

來源

2010-08-24 17:21:17 Andrew

哎呦。修復。 – MetalAdam 2010-08-24 17:23:34

我不認爲在大多數情況下設置超時是一個好主意...... – 2010-08-24 18:05:34

邁克 - 你有替代解決方案嗎？安德魯 - 作品。這只是一個臨時頁面，所以現在就可以完成。謝謝！ – MetalAdam 2010-08-24 18:19:12

windows.setTimeout並不總是有用，因爲有時該過程可能比您設置的超時花費更多的時間。所以最好在fadeOut完成後使用下面的代碼來運行fadeIn。

$("#events_link").click(function() { 
    $.when(
     // Your function which you want to finish first 
     // $("#content").children(".content").fadeOut(fadetime) 
    ).done(function() { 
     // The function which you want to run after finishing the previous function 
     // $("#events").fadeIn(fadetime); 
    }); 
    return false 
});*

來源

2013-01-03 09:58:52

jquery：在fadeOut之前運行的函數完成

回答

相關問題