CSS-Secrets icon indicating copy to clipboard operation
CSS-Secrets copied to clipboard

[注解] [801] 缓动效果

Open cssmagic opened this issue 8 years ago • 0 comments

花絮与注解

第 199 页 ‧ 第二段

所有这五种曲线都是通过(三次)贝塞尔曲线来指定的……

关于 “贝塞尔曲线” 的更多信息,请参见:https://zh.wikipedia.org/wiki/貝茲曲線 。

第 200 页 ‧ “致敬” 区块

在 Dan Eden 编写的 animate.css 动画库中,所用到的调速函数分别是 cubic-bezier(.215,.61,.355,1)cubic- bezier (.755,.05,.855,.06)(后者并不是前者的反向版本,它的曲线更加陡峭,效果也更加逼真)。

利用作者开发的 cubic-bezier.com 网站,我们可以看到这两个曲线的可视化版本:

  • http://cubic-bezier.com/#.21,.61,.35,1
  • http://cubic-bezier.com/#.75,.05,.85,.06

确实相当陡峭。

cssmagic avatar Sep 16 '17 08:09 cssmagic