欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

jquery自定义动画

程序员文章站 2022-03-17 13:00:32
...
停止动画
hello
点击
<script src="./jquery-3.4.1.js"></script>
<script>
    $("#start").click(function(){
        // 有些css样式不支持动画
        // para1:object,需要动画的样式key-value对象
        // para2:动画时间,可以缺省,默认是400
        // para3:动画速率函数,可以缺省
        // para4:动画结束的回调函数,可以缺省
        $("div").animate(
            {
                height:"400px",
                "font-size":"100px"
            },
            4000,
            "linear",
            function(){
                console.log("动画完成了");
            })
            // delay:延迟;延迟一定时间
            .delay(1000)
            .animate(
            {
                height:"100px"
            },
            4000
        )
    })
    $("#stop").click(function(){
        //para1:clearQueue,是否清除动画队列;
        //para2:jumpToEnd,是否跳到动画结束;
        $("div").stop(false,true);
    })

    // velocity.js