2012-11-09 44 views
6

我試圖連續執行這些removeClass調用。似乎沒有使用removeClass的回調函數,那麼是否有另一種方法來模擬它?我可以模仿jquery removeClass的回調函數嗎?

$("#card1").removeClass('flip'); 

    //wait for card1 flip to finish and then flip 2 
    $("#card2").removeClass('flip'); 

    //wait for card2 flip to finish and then flip 3 
    $("#card3").removeClass('flip'); 
+0

你總是可以使用一個計時器 – Huangism

+0

有沒有等待從元素中刪除一個類,你刪除它並添加它。有什麼意義? –

+0

這是CSS3過渡的一部分,所以我正在尋找一個有趣的效果。 – Paul

回答

8

看來您正在使用CSS3轉換來完成此操作。 要做到這一點,最簡單的方法是設置手動延遲:

$("#card1").removeClass('flip'); 

setTimeout(function(){ 
    //wait for card1 flip to finish and then flip 2 
    $("#card2").removeClass('flip'); 
}, 500); 

setTimeout(function(){ 
    //wait for card2 flip to finish and then flip 3 
    $("#card3").removeClass('flip'); 
}, 1000); 

有沒有內置的jQuery的方法來檢查CSS轉換完成。

+1

'transitionEnd'事件(或'webkitTransitionEnd'等)應該可以工作。 – pimvdb

+0

...或者'mozTransitionEnd'等。我認爲計時器現在更好,並且在'transitionEvent'事件不會觸發的情況下會更加防彈。 – Inferpse

+0

表示同意,這是做的伎倆,謝謝! – Paul

相關問題