動畫閃爍不透明度動畫的最后一個序列

Question

我有三個從opacity: 0動畫處理的div元素opacity: 0 > opacity: 1 。

我同時為最后兩個元素設置動畫，由於某種原因， 當最后一個元素達到opacity: 1時，我會遇到一些奇怪的閃爍opacity: 1

http://jsfiddle.net/dmfux4LL/ （注意右上方的“ IMAGE 2”文本）

閃爍已在Firefox + Chrome中注意到。

獎勵問題 ：由於某種原因，“圖像2”文本甚至無法在IE中創建動畫。

我在做什么是：

CSS:
#frame1-image1, #frame1-image2, #logo-container {
    opacity: 0;
}
JS:
frame1Image1.delay(300).animate(
    { opacity: 1 },
    {
        duration: defaultDurationTime, 
        easing: 'swing',
        complete: function() { // the callback
            console.log("done");
        }
    });

frame1Image2.delay(400).animate(
    { opacity: 1 },
    {
        duration: defaultDurationTime, 
        easing: 'swing',
        complete: function() { // the callback
            console.log("done");
        }
    });

logoContainer.delay(400).animate(
    { opacity: 1 },
    {
        duration: defaultDurationTime, 
        easing: 'swing',
        complete: function() { // the callback
            console.log("done");
        }
    });