jquery animate()动画 函数 学习

<div id="box" style="background: #98bf21;height:100px;width:100px;margin:6px;">
测试文字
</div>
<button class="btn1">Animate</button>
<button class="btn2">Reset</button>
<script>

    $(function(){
        $(".btn1").click(function(){
            $("#box").animate({
                //字体变为三倍
                fontSize:'3em',
                opacity:'0.5',
//                你可以通过在属性值前面指定 "+=" 或 "-=" 来让元素做相对运动
                margin:"+=50px",
                height:"+=300px"

            }, 5000, "swing", function(){
                alert("先执行完效果，在执行回调函数1");
            });
        });

        $(".btn2").click(function(){
            $("#box").animate({
                fontSize:'1em',
                opacity:'1',
                margin:"6px",
                height:"100px"
            }, 5000, "swing", function(){
                alert("先执行完效果，在执行回调函数");
            });
        });
    });


</script>

在网上找的api ，个人觉得是要注意其可以执行效果的参数

Alternate 语法