动画效果

在jQuery中，提供了animate()方法创建自定义的动画

语法：$(selector).animate({params},speed,callback);

params为必需的参数定义形成动画的CSS属性。speed和callback是可选参数，前者规定效果的时长，取值为："slow"、"fast"和毫秒；后者是动画完成后执行的函数名称。

示例如下：

(1)描述

点击按钮看到动画效果

(2)代码实现

<script type="text/javascript">
$(function(){ //增加表单中所有属性为可用的元素类别
    $("#btn").click(function(){
    $("div").animate({
        height:"200px",
        width: "660px"
    },"slow",function(){
        $("div").animate({
            height:"80px",
        width: "80px"
        },"slow")
    });
    })
})
</script>
...省略代码

<h3> 动画效果</h3>

<input type="button" id="btn" value="点击看效果"/>
<div style="width:80px;height:80px;background-color:#FF9966"></div>