1
1
# better-scroll
2
2
[ ![ npm] ( https://img.shields.io/npm/v/better-scroll.svg?style=flat-square )] ( https://www.npmjs.com/package/better-scroll )
3
3
4
- inspired by iscroll, and it has a better scroll perfermance
4
+ inspired by iscroll, and it has a better scroll perfermance https://ustbhuangyi.github.io/better-scroll/
5
5
6
6
## 立即使用
7
7
@@ -43,7 +43,7 @@ var BScroll = require('better-scroll')
43
43
```
44
44
45
45
## DEMO
46
- better-scroll的源码是基于webpack构建的
46
+ better-scroll 的源码是基于 Webpack 构建的
47
47
48
48
首先,clone项目源码
49
49
@@ -86,22 +86,23 @@ Options List:
86
86
- scrollY: ` true ` 滚动方向
87
87
- click: ` true ` 是否启用click事件
88
88
- directionLockThreshold: ` 5 `
89
- - momentum: ` true ` 是否开启动量动画,关闭可以提升效率
89
+ - momentum: ` true ` 是否开启拖动惯性
90
90
- bounce: ` true ` 是否启用弹力动画效果,关掉可以加速
91
- - selectedIndex: ` 0 `
92
- - rotate: ` 25 `
91
+ - selectedIndex: ` 0 `
92
+ - rotate: ` 25 `
93
93
- wheel: ` false ` 是否监听鼠标滚轮事件
94
- - snap: ` false ` 自动分割容器,用于制作走马灯效果等
95
- - snapLoop: ` false `
96
- - snapThreshold: ` 0.1 `
97
- - swipeTime: ` 2500 `
94
+ - snap: ` false ` 是否开启捕捉元素,当为 true 时,捕捉的元素会根据可滚动的位置和滚动区域计算得到可滑动几页。
95
+ - snapLoop: ` false ` 是否创建当前滚动元素子集的拷贝
96
+ - snapThreshold: ` 0.1 ` 滑动的长度限制,只有大于这个距离才会触发事件
97
+ - swipeTime: ` 2500 ` swipe 持续时间
98
98
- bounceTime: ` 700 ` 弹力动画持续的毫秒数
99
99
- adjustTime: ` 400 `
100
100
- swipeBounceTime: ` 1200 `
101
101
- deceleration: ` 0.001 ` 滚动动量减速越大越快,建议不大于0.01
102
- - momentumLimitTime: ` 300 `
103
- - momentumLimitDistance: ` 15 `
102
+ - momentumLimitTime: ` 300 ` 惯性拖动的回弹时间
103
+ - momentumLimitDistance: ` 15 ` 惯性拖动的回弹距离
104
104
- resizePolling: ` 60 ` 重新调整窗口大小时,重新计算better-scroll的时间间隔
105
+ - probeType: ` 1 ` 监听事件的触发时间,1为即时触发,3为延迟到事件完毕后触发
105
106
- preventDefault: ` true ` 是否阻止默认事件
106
107
- preventDefaultException: ` { tagName: /^(INPUT|TEXTAREA|BUTTON|SELECT)$/ } ` 阻止默认事件
107
108
- HWCompositing: ` true ` 是否启用硬件加速
@@ -125,22 +126,28 @@ scroll.on('scroll', (pos) => {
125
126
126
127
Events 列表
127
128
128
- - beforeScrollStart 滚动开始之前触发
129
- - scrollStart 滚动开始时触发
130
- - scroll 滚动时触发
131
- - scrollCancel 取消滚动时触发
132
- - scrollEnd 滚动结束时触发
133
- - flick
134
- - refresh
135
- - destroy 销毁better-scroll实例时触发
129
+ - beforeScrollStart - 滚动开始之前触发
130
+ - scrollStart - 滚动开始时触发
131
+ - scroll - 滚动时触发
132
+ - scrollCancel - 取消滚动时触发
133
+ - scrollEnd - 滚动结束时触发
134
+ - flick - 触发了 fastclick 时的回调函数
135
+ - refresh - 当 better-scroll 刷新时触发
136
+ - destroy - 销毁 better-scroll 实例时触发
136
137
137
138
138
139
## 派发滚动
139
140
141
+ - scrollTo(x, y, time, easing)
142
+
143
+
144
+
145
+ Example:
146
+
140
147
``` javascript
141
148
let scroll = new BScroll (document .getElementById (' wrapper' ))
142
149
scroll .scrollTo (0 , 500 )
143
150
...
144
151
```
145
152
146
- 第一个参数为X轴,第二个参数为Y轴
153
+
0 commit comments