jQuery中CSS屬性的不同持續時間animate（）

Question

我使用jQuery來爲頁面上的DOM元素設置動畫效果，並在使用其本地animate()時遇到障礙。

我試圖將我的元素移動到右側並更改其不透明度。

$element.animate({ 
    'left': '50%', 
    'opacity': '1.0' 
}, 1000); 

它工作得很好，但我需要在動畫MS 1000位置和不透明在 MS 300。

我發現我不能寫這樣的：

$element.animate({ 
    'left': '50%' 
}, 1000); 


$element.animate({ 
    'opacity': '1.0' 
}, 300); 

這將導致排隊動畫，因爲它是相同的元素和jQuery顯然需要等待第一動畫完。或者我在這裏做錯了什麼。

我嘗試使用第二個參數符號（基於http://api.jquery.com/animate）和使用queue: false，但它沒有奏效。我必須說我不完全理解，所以任何更正都是值得歡迎的。

所以我的問題是這樣 - 如何獨立更改這些CSS屬性的持續時間間隔？

Answer 1

我想你在嘗試使用queue時處於正確的軌道。這裏有一個如何這應該是工作的一個例子，我希望它能幫助：

$('#element').animate({ left:'50%' }, { queue: false, duration: 1000 }) 
      .animate({ opacity : '1.0' }, { queue : false, duration: 300 }); 

編輯：測試成功:)

Answer 2

你可以在一次呼叫中爲兩個動畫300毫秒。最多3/10的位置變化，然後動態化剩餘的位置變化700ms？