ScrollBooster
ScrollBooster 介绍
ScrollBooster是一个轻量级滚动库。实现手机上的拖动反弹效果，可以限制拖动方向等效果，它可用于表格、图像和任何其他内容。
ScrollBooster安装
npm i scrollbooster
或者
<script src="https://unpkg.com/scrollbooster@1.0.4/dist/scrollbooster.min.js"></script>
使用
import ScrollBooster from 'scrollbooster'
let sb = new ScrollBooster({
viewport: document.querySelector('.viewport') // required
// ...other options
})
选项
Option
Type
Default
Description
viewport
element
null
视区-外部元素
content
element
First child of viewport element
视区内可滚动内容
handle
element
Viewport element
响应拖动事件的元素
bounce
boolean
true
惯性弹跳效果 (滚动过去视区边框)
textSelection
boolean
false
能够选择文本内容
friction
float
0.05
滚动摩擦因数 (指针释放后的滚动惯性)
bounceForce
float
0.1
弹跳效应因子
emulateScroll
boolean
false
模拟视区鼠标滚轮事件 (对于使用转换属性滚动的情况)
onUpdate
function
noop
根据接收的坐标更新元素属性的用户函数 (请参见演示示例)。接收具有属性的对象: 位置、视区和内容。每个属性都包含用于执行实际滚动的度量值
方法
Method
Description
setPosition
在视区中设置新的滚动位置。接收具有属性 x 和 y 的对象
updateMetrics
更新元素大小。对图像加载或其他动态内容有用
getUpdate
与onUpdate相同的格式返回当前指标和坐标
destroy
销毁所有实例的事件侦听器
网站地址:https://ilyashubin.github.io/scrollbooster/
GitHub:https://github.com/ilyashubin/scrollbooster
网站描述:一个轻量级滚动库