CSS transitionEnd事件還在聽完成過渡

我有兩個div元素即.parentDiv和.childDivCSS transitionEnd事件還在聽完成過渡

我使用CSS過渡動畫兩者。 .childDiv應該首先在不透明度上進行動畫處理，然後在轉場結束時動畫.parentDiv高度，然後調用警報檢查。

所以這裏是代碼：

$('.childDiv').addClass('faded').on('transitionend', function(){ 
      $('.childDiv').off('transitionend'); 

      $('.parentDiv') 
       .addClass('no-height') 
       .on('transitionend',event, function() { 
        alert(event.propertyName); 
       }); 
     });

問題：

.addClass('faded')後，繼續執行第二過渡（這是正確的）。但在.parentDiv的轉換終端上，已提醒的event.propertyName是'不透明'，並且.childDiv完成轉換後即被觸發。

我希望它只在調整高度時執行。不要誤解，一旦高度過渡完成，「高度」也會被警告，但它看起來也會讀取高度調整以外的其他過渡。

這裏是它的一個的jsfiddle： http://jsfiddle.net/e9uwA/

感謝您的幫助！

來源

2013-04-25 AJ Naidas

只需添加event.stopPropagation（）在$（ 'childDiv'）。在（）

因爲childDiv的事件將傳播到parentDiv

來源

2013-04-25 09:14:38

看到這個鏈接http://jsfiddle.net/e9uwA/1/ – 2013-04-25 09:18:33

哇那麼簡單！我從來沒有完全理解event.stopPropagation（）;但是現在我可能已經有了一點點了。謝謝！ – 2013-04-25 09:23:08

CSS transitionEnd事件還在聽完成過渡

回答

相關問題