在JQuery中爲變量設置動畫效果

Question

我一次爲多個元素設置動畫，某些元素的最終屬性取決於其他元素的屬性。例如，我喜歡$('#a').animate({height:$('#b').height()})，但$('#b').height()在動畫過程中發生了變化。有沒有辦法讓動畫在最終的$('#b').height()上完成？

Answer 1

我假設你想動畫的#a高度符合的#b的最終高度，即高度元素具有動畫後。

您可以通過更新step函數中fx對象的end值來實現此目的。例如：

var $a = $('#a').animate({height: 50}, 2000); 

$('#b').animate({height: $a.height()}, { 
    duration: 2000, 
    step: function(now, fx) { 
     if (fx.prop === 'height') { 
      fx.end = $a.height(); 
     } 
    } 
}); 

DEMO（注：我得到的元素名稱的另一種方式圓）

當然，這僅當第二個動畫是至少只要它取決於動畫作品。

更多的信息在documentation。