better-scroll 简单实用说明
2017-11-03 14:32
302 查看
参数说明:
startX: 0 开始的X轴位置
startY: 0 开始的Y轴位置
scrollY: true 滚动方向
click: true 是否启用click事件
directionLockThreshold: 5
momentum: true 是否开启动量动画,关闭可以提升效率
bounce: true 是否启用弹力动画效果,关掉可以加速
selectedIndex: 0
rotate: 25
wheel: false 是否监听鼠标滚轮事件
snap: false 自动分割容器,用于制作走马灯效果等
snapLoop: false
snapThreshold: 0.1
swipeTime: 2500
bounceTime: 700 弹力动画持续的毫秒数
adjustTime: 400
swipeBounceTime: 1200
deceleration: 0.001 滚动动量减速越大越快,建议不大于0.01
momentumLimitTime: 300
momentumLimitDistance: 15
resizePolling: 60 重新调整窗口大小时,重新计算better-scroll的时间间隔
preventDefault: true 是否阻止默认事件
preventDefaultException: { tagName: - /^(INPUT|TEXTAREA|BUTTON|SELECT)$/ } 阻止默认事件
HWCompositing: true 是否启用硬件加速
useTransition: true 是否使用CSS3的Transition属性,否则使用requestAnimationFram代替
useTransform: true 是否使用CSS3的Transform属性
probeType: 1 滚动的时候会派发scroll事件,会截流。2滚动的时候实时派发 - scroll事件,不会截流。 3除了实时派发scroll事件,在swipe的情况下仍然能实时派发scroll事件
Events 事件
Events 列表
beforeScrollStart 滚动开始之前触发
scrollStart 滚动开始时触发
scroll 滚动时触发
scrollCancel 取消滚动时触发
scrollEnd 滚动结束时触发
flick
refresh
destroy 销毁better-scroll实例时触发
派发滚动
startX: 0 开始的X轴位置
startY: 0 开始的Y轴位置
scrollY: true 滚动方向
click: true 是否启用click事件
directionLockThreshold: 5
momentum: true 是否开启动量动画,关闭可以提升效率
bounce: true 是否启用弹力动画效果,关掉可以加速
selectedIndex: 0
rotate: 25
wheel: false 是否监听鼠标滚轮事件
snap: false 自动分割容器,用于制作走马灯效果等
snapLoop: false
snapThreshold: 0.1
swipeTime: 2500
bounceTime: 700 弹力动画持续的毫秒数
adjustTime: 400
swipeBounceTime: 1200
deceleration: 0.001 滚动动量减速越大越快,建议不大于0.01
momentumLimitTime: 300
momentumLimitDistance: 15
resizePolling: 60 重新调整窗口大小时,重新计算better-scroll的时间间隔
preventDefault: true 是否阻止默认事件
preventDefaultException: { tagName: - /^(INPUT|TEXTAREA|BUTTON|SELECT)$/ } 阻止默认事件
HWCompositing: true 是否启用硬件加速
useTransition: true 是否使用CSS3的Transition属性,否则使用requestAnimationFram代替
useTransform: true 是否使用CSS3的Transform属性
probeType: 1 滚动的时候会派发scroll事件,会截流。2滚动的时候实时派发 - scroll事件,不会截流。 3除了实时派发scroll事件,在swipe的情况下仍然能实时派发scroll事件
Events 事件
let scroll = new BScroll(document.getElementById('wrapper'),{ probeType: 3 }) scroll.on('scroll', (pos) => { console.log(pos.x + '~' + posx.y) ... })
Events 列表
beforeScrollStart 滚动开始之前触发
scrollStart 滚动开始时触发
scroll 滚动时触发
scrollCancel 取消滚动时触发
scrollEnd 滚动结束时触发
flick
refresh
destroy 销毁better-scroll实例时触发
派发滚动
let scroll = new BScroll(document.getElementById('wrapper')) scroll.scrollTo(0, 500) ...
相关文章推荐
- [简单实用系列] 说明
- RequireJS简单实用说明
- UE4 行为树装饰器(Decorator)简单实用说明(1)
- Objective-C 生成器模式 -- 简单实用和说明
- NPM 简单实用说明
- better-scroll实现下拉刷新、上拉加载更多(巨简单...)
- JAVA内部类的一些简单实用说明
- 简单实用的HTML到UBB转换脚本工具实现说明
- 简单实用的HTML到UBB转换脚本工具实现说明
- UE4 行为树装饰器(Decorator)简单实用说明(2)
- 一个简单实用的文本分类步骤说明[firefly]
- git简单实用与说明
- Valgrind的简单实用说明
- 四大常见XML类型的生成和解析方法详解(介绍+优缺点对比+示例+说明)==> 简单实用
- LXC 简单实用说明
- Objective-C 桥接模式 -- 简单实用和说明
- asp.net 中DataGrid自定义分页(简单,实用,易懂)
- C语言里面函数嵌套调用的简单说明谢谢
- fileUpload拦截器的简单实用
- 简单PHP会话(session)说明介绍