ease

定义所有动画属性或特定属性的缓动函数。
缓动函数控制属性值随时间的变化速率，决定动画在播放过程中不同时间点的速度。

所有 Anime.js 内置的缓动函数都可以通过传递缓动名称 String 或访问 eases 对象上的函数来使用。

接受

An easing Function
A built-in ease String
A Function based value that returns an easing Function or a built-in ease String

默认

'out(2)'

要全局更改默认值，请更新 engine.defaults 对象。

import { engine } from 'animejs';
engine.defaults.ease = 'outElastic(1, .5)'; // v3 throwback :)

轻松代码示例

import { animate, waapi, eases, spring } from 'animejs';

animate('.row:nth-child(1) .square', {
  x: '17rem',
  rotate: 360,
  ease: 'inQuad',
});

animate('.row:nth-child(2) .square', {
  x: '17rem',
  rotate: 360,
  ease: eases.outQuad,
});

waapi.animate('.row:nth-child(3) .square', {
  x: '17rem',
  rotate: {
    to: 360,
    ease: 'out(6)',
  },
  ease: spring({ stiffness: 70 }),
});

<div class="medium row">
  <div class="square"></div>
  <div class="padded label">all: 'inQuad'</div>
</div>
<div class="medium row">
  <div class="square"></div>
  <div class="padded label">all: eases.outQuad</div>
</div>
<div class="medium row">
  <div class="square"></div>
  <div class="padded label">x: spring()<br>rotate: 'inQuad'</div>
</div>