数值

通过传递 Number（数字）或包含至少一个 Number 的 String（字符串），来指定动画属性的数值。

如果对于需要单位的属性（例如 width）未指定单位，动画将默认使用浏览器的单位。

animate(target, { width: 100 }); // Defaults to px

接受

数字
字符串

如果已经指定了特定单位，JS 的 animate() 方法可以继承先前定义的单位；在同一个目标属性上，后续设置且未指定单位的值也会继承先前定义的单位。

animate(target, { width: '50%' }); // Uses '%'
animate(target, { width: 75 });    // Inherits '%' -> '75%'

WAAPI 的 animate() 方法仅在以下属性中会自动回退到 'px' 单位

- x / translateX
- y / translateY
- z / translateZ
- perspective
- top
- right
- bottom
- left
- width
- height
- margin
- padding
- borderWidth
- borderRadius
- fontSize

数值代码示例

import { waapi } from 'animejs';

waapi.animate('.square', {
  x: 240, //  -> 240px
  width: 75, // -> 75px
  rotate: '.75turn',
});

<div class="large row">
  <div class="square"></div>
</div>