css 动画系列 --4 final

Cubic Bezier (动画加减速函数)

  • liner(线性), 没有任何加速减速,在 Cubic Bezier 的斜率为 1 的直线
  • ease、ease-in、ease-out、ease-in-out,具有加速减速的效果
    • ease,表示开始时候急加速,快结束的时候开始减速
    • ease-in,表示慢慢加速
    • ease-out,表示先加速后再慢慢减速
    • ease-in-out,表示开始慢慢加速,最后慢慢减速

上面的文字可能理解起来比较抽象,大家可以到我引入的网页里进行测试,可以直接到这个链接去自己测试。测试地址
这个网站测试比较方便,还以自己调整一些其它的效果,通过它将代码考下来就行。

最后在介绍一个非常有用的开源CSS项目,有空大家可以去看看 Animate.CSS