播放速率 V4

定义一个速度乘数,用于加快或减慢动画。
此值之后可以使用 animation.speed = .5 进行修改。

接受

一个大于或等于 0Number 类型值

如果设置为 0,动画将不会播放。

默认值

1

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

import { engine } from 'animejs';
engine.defaults.playbackRate = .75;

播放速率代码示例

import { animate, utils } from 'animejs';

const [ $range ] = utils.$('.range');
const [ $speed ] = utils.$('.speed');

const animation = animate('.circle', {
  x: '16rem',
  loop: true,
  alternate: true,
  playbackRate: 1,
});

const updateSpeed = () => {
  const { value } = $range;
  $speed.innerHTML = utils.roundPad(+value, 2);
  utils.sync(() => animation.speed = value);
}

$range.addEventListener('input', updateSpeed);
<div class="large row">
  <div class="circle"></div>
  <pre class="large log row">
    <span class="label">speed</span>
    <span class="speed value">1.00</span>
  </pre>
</div>
<div class="medium row">
  <fieldset class="controls">
    <input type="range" min=0 max=5 value=1 step=.01 class="range" />
  </fieldset>
</div>