jquery動畫函數如何在內部工作？

Question

這裏是小碼

<div id="clickme"> 
Click here 
</div> 
<img id="book" src="book.png" alt="" width="100" height="123" 
style="position: relative; left: 10px;" /> 

$('#clickme').click(function() { 
$('#book').animate({ 
    opacity: 0.25, 
    left: '+=50', 
    height: 'toggle' 
}, 5000, function() { 
    // Animation complete. 
    }); 
}); 

很顯然從代碼左邊增加和透明度將是0.25。 jquery是如何做到這一點的...... jQuery在內部執行一個循環來增加左邊並改變不透明度，直到它變成.25。需要指導。謝謝

Answer 1

它使用計時器在設定的時間段逐漸增加（或減少）值。它不能使用循環，因爲如果是這樣的話，它會阻止/凍結主js線程，並且你不會看到動畫。 js中的所有內容都是（或者應該）是異步的，通過事件。

Answer 2

要知道生命的代碼的外觀和作業看看源：

https://github.com/jquery/jquery/blob/master/src/effects.js