找出哪個CSS屬性正在通過jQuery動畫

Question

我看到$element.is(':animated')告訴我$元素是否正在動畫，但是有可能看到哪些CSS屬性正在動畫。

Answer 1

是的，將step函數傳遞給animate（）調用將允許您通過fx.prop找出正在動畫的屬性。下面是從jQuery API文檔的一個示例：

$('li').animate({ 
    opacity: .5, 
    height: '50%' 
}, 
{ 
    step: function(now, fx) { 
    var data = fx.elem.id + ' ' + fx.prop + ': ' + now; 
    $('body').append('<div>' + data + '</div>'); 
    } 
}); 

的兩個參數的step功能如下：

現在：屬性的數值在每一步

被動畫

fx：對jQuery.fx原型對象的引用，其中包含 的屬性，例如elem爲動畫元素，start和end爲 分別爲動畫屬性的第一個和最後一個值， 爲prop，屬性爲動畫。

請注意，該函數運行動畫的每個「步驟」，因此它會經常激發。您可以使用它來更新當前動畫屬性或類似的數組。