JQuery animate

jQuery animate() 方法用於建立自定義動畫。
語法：
$(selector).animate({params},speed,callback);
必需的 params 參數定義造成動畫的 CSS 屬性。
可選的 speed 參數規定效果的時長。它能夠取如下值："slow"、"fast" 或毫秒。
可選的 callback 參數是動畫完成後所執行的函數名稱。

 

默認地，全部 HTML 元素都有一個靜態位置，且沒法移動。

如需對位置進行操做，要記得首先把元素的 CSS position 屬性設置爲 relative、fixed 或 absolute！

 

下面的例子演示 animate() 方法的簡單應用；它把 <div> 元素移動到左邊，直到 left 屬性等於 170 像素爲止：

<script>
$(document).ready(function(){
$("button#bDemo").click(function(){
$("div#divDemo").animate({left:"170px",opacity:"0.5"},"slow");
$("div#divDemo").animate({fontSize:"5em"},"slow");
});
});
</script>

<button id="bDemo">開始動畫</button><br><br>
<div id="divDemo" style="background:#98bf21;height:100px;width:210px;position:relative;">jQuery</div>

</div>