什么是 easing-animation？
Easing-Animation 是一个小巧的 JavaScript 库，为动画应用 CSS 的 缓动函数（easing functions）。它是一个轻量级的工具，只有 1kB 大小（gzip 压缩后），适用于所有主流浏览器和本地的 Node.js。
如何使用 easing-animation？
安装
你可以使用 npm 安装：
npm install easing-animation
或者使用 yarn：
yarn add easing-animation
用法
你可以使用以下代码来添加 easing-animation：
-- -------------------- ---- ------- ------ - ------- - ---- ------------------- --------- -------- -------------------------------------- --------- ----- ------- ---------------- --------- ------------ ----------- --------------- --------- ---------------- ---------- -- - ---------------------- ------------ ---
参数说明
animate() 方法接受一个设置动画参数的对象作为参数：
element：要进行动画的 DOM 元素。duration：动画持续时间（以毫秒为单位）。easing：缓动函数名称。支持所有 缓动函数 。property：CSS 属性名称，例如：transform或opacity。startValue：动画的起始值。endValue：动画的结束值。
easing-animation 还可以使用回调函数来过渡动画结束后的操作。例如：
-- -------------------- ---- -------
---------
-------- --------------------------------------
--------- -----
------- ----------------
--------- ------------
----------- ---------------
--------- -----------------
--------- ---------- -
---------------------- ------------
-
---示例代码
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
----------------------- ----------
-------
---------- -
------ ------
------- ------
----------------- ----
-
--------
-------
------
---- ---------------------
--------
------ - ------- - ---- -------------------
---------
-------- --------------------------------------
--------- -----
------- ----------------
--------- ------------
----------- ---------------
--------- ----------------
---------- -- -
---------------------- ------------
---
---------
-------
-------指导意义
缓动函数在动画设计中非常重要，可以让你的动画更加流畅自然。Easing-Animation 包装了一系列标准的缓动函数，为你节约了编写自定义缓动函数的时间。使用 easing-animation 可以轻松地实现自己所需的动画效果。
结论
easing-animation 是一个小而精的 npm 包，它提供了简单而轻便的 API，使得缓动函数的使用变得异常容易。如果你需要添加缓动函数到你的动画中，那么 easing-animation 绝对是一个值得推荐的工具。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055c3981e8991b448d9d62