方法名
定义链接的 Object 的方法名列表，在特定回调被触发时调用。
接受
包含动画方法、定时器方法或时间轴方法名称列表的 String，名称之间用空格分隔
回调定义顺序
'进入'
定义一个方法，当进入阈值被跨越或元素重新进入视口时触发。
{
sync: 'play',
}'进入 离开'
定义在进入和离开阈值被跨越时触发的方法。
{
sync: 'play pause',
}'向前进入 向前离开 向后进入 向后离开'
定义在向前滚动时跨越进入和离开阈值以及向后滚动时跨越进入和离开阈值时触发的方法。
{
sync: 'play pause reverse reset',
}默认
'播放 暂停'
方法名代码示例
import { animate, onScroll } from 'animejs';
animate('.square', {
x: '15rem',
rotate: '1turn',
duration: 2000,
autoplay: onScroll({
container: '.scroll-container',
enter: 'bottom-=50 top',
leave: 'top+=60 bottom',
sync: 'resume pause reverse reset',
debug: true
})
});<div class="scroll-container scroll-y">
<div class="scroll-content grid square-grid">
<div class="scroll-section padded">
<div class="large row">
<div class="label">scroll down</div>
</div>
</div>
<div class="scroll-section padded">
<div class="large row">
<div class="square"></div>
</div>
</div>
<div class="scroll-section">
</div>
</div>
</div>