滚动捕捉可根据页面滚动条的位置控制动画的播放与回放,增强页面滚动的交互性,常用于视差滚动效果。
配置选项
起始点
String | Function
设置容器进入视图的点位。
结束点
String | Function
设置容器离开视图的点位。
// 字符串形式
"top center"
"bottom 80%"
"top bottom-=100px"
// 函数
// 使用 '()' 或 'function' 开头的内容将自动识别为函数内容。如果需要使用当前选择器,使用 '::selector' 代替。
() => '+=' + ::selector.offsetWidth
function() {
return '+=' + document.querySelector('.box').offsetWidth
}
平滑
Number
设置动画的平滑参数,单位为s,表示动画在滚动停止后持续多长时间完成动画。
启用标记
Boolean
开发模式下可启用标记查看滚动的起始点与结束点等。