开始动画

//设置大小

贝塞尔曲线(Bézier curve)：

又称贝兹曲线或贝济埃曲线，是应用于二维图形应用程序的数学曲线。一般的矢量图形软件通过它来精确画出曲线，贝兹曲线由线段与节点组成，节点是可拖动的支点，线段像可伸缩的皮筋，我们在绘图工具上看到的钢笔工具就是来做这种矢量曲线的。贝塞尔曲线是计算机图形学中相当重要的参数曲线，在一些比较成熟的位图软件中也有贝塞尔曲线工具，如PhotoShop等。在Flash4中还没有完整的曲线工具，而在Flash5里面已经提供出贝塞尔曲线工具。
贝塞尔模拟：

http://cubic-bezier.com/#.17,.67,.83,.67
动画要求：


代码：
@keyframes followMe {
        0% {transform: translate3d(0, 0, 0);
        transition-timing-function:cubic-bezier(0.26,0.00,0.60,0.20);}
        10% {transform: translate3d(0, -10px, 0);
        transition-timing-function:cubic-bezier(0.40,0.80,0.74,1.00);}
        20% {transform: translate3d(0, 0, 0);
        transition-timing-function:cubic-bezier(0.26,0.00,0.60,0.20);}
        30% {transform: translate3d(0, 0, 0);
        transition-timing-function:cubic-bezier(0.40,0.80,0.74,1.00);}
        40% {transform: translate3d(0, -10px, 0);
        transition-timing-function:cubic-bezier(0.26,0.00,0.60,0.20);}
        50% {transform: translate3d(0, 0, 0);}
        100% {transform: translate3d(0, 0, 0)}
    }
.swiper-follow{
        animation: followMe 2s;
        animation-delay: 3s;
        animation-iteration-count: 2;
    }

按住shift，用选择工具单击或框选即可一次性选择多个不同的对象

    
$("p").css("color","red");
$("p").css({
　　"font-size":"8px",
　　"background-color":"#8888888"
});


$("div").animate({"width":"200px"});
$("div").animate({
　　"width":"200px",
　　"height":"300px"
});

 

转载于:https://www.cnblogs.com/tongzhou/p/6795262.html