scrollInView()
如果可拖动元素的位置超出滚动阈值，则动画容器的滚动位置。
参数
| 名称 | 类型 | 描述 |
|---|---|---|
| 持续时间(可选) | 数字 |
动画的持续时间 (默认值 350) |
| 间距(可选) | 布尔值 |
可拖动元素应动画到距离容器边缘的额外距离 |
| 缓动(可选) | ease |
应用于动画的缓动函数 (默认值 InOutQuad |
返回
可拖动元素本身
scrollInView() 代码示例
import { createDraggable } from 'animejs';
const [ $scrollInView ] = utils.$('.button');
const draggable = createDraggable('.square', {
container: '.scroll-container',
});
const scrollInView = () => {
draggable.scrollInView(400, 100);
}
// Set the draggable position outside the scroll viewport
draggable.x = 120;
draggable.y = 200;
$scrollInView.addEventListener('click', scrollInView);<div class="scroll-container scroll-x scroll-y">
<div class="scroll-content">
<div class="large padded grid square-grid">
<div class="square draggable"></div>
</div>
</div>
</div>
<fieldset class="absolute controls">
<button class="button">Scroll in view</button>
</fieldset>