0.0.1 • Published 2 years ago
@humandetail/scroller v0.0.1
Scroller
📦 Install
Install with npm:
npm i @humandetail/scroller
Install with yarn:
yarn add @humandetail/scroller
🦄 Usage
import Scroller from '@humandetail/scroller'
const scroller = new Scroller('.content', {
height: '500px'
})
📖 Params
参数 | 类型 | 初始值 | 说明 |
---|---|---|---|
wheelStep | number | 20 | 应用于每个鼠标滚轮步骤的滚动量 |
width | string | auto | 容器的宽度 |
height | string | 100vh | 容器的高度 |
scrollbarWidth | number | 10 | 滚动条的宽度 |
buttonSize | number | 10 | 滚动条按钮的尺寸 |
trackWidth | number | 10 | 滚动条轨道的宽度 |
thumbWidth | number | 10 | 滚动条滑块的宽度 |
resize | boolean | true | 是否监听窗口的 resize 事件 |
observe | boolean | true | 是否监听 DOM 变化 |
reachOffset | object | { top: number; right: number; bottom: number; left: number; } | 触底/触顶偏移量 |
button | boolean | true | 是否需要上下按钮 |
styles | object | { bar?: Partial<CSSStyleDeclaration>; button?: Partial<CSSStyleDeclaration>; track?: Partial<CSSStyleDeclaration>; thumb?: Partial<CSSStyleDeclaration>; } | 滚动条样式 |
📄 License
MIT License © 2019-PRESENT Humandetail
0.0.1
2 years ago