使用better-scroll横向滚动2018-10-17

使用better-scroll要使内层容器宽度大于外层容器才可以滚动,当内层容器宽度等于外层容器时,无法滚动,这时候就需要动态设置内层容器宽度。


计算内容容器宽度并赋值给dom, dom更新之后初始化better-scroll即可,传入参数scrollX表示横向滚动,eventPassthrough:vertical表示在横竖滚动同时存在时,不会互相影响

eventPassthrough类型: String默认值:''                                                                 可选值:'vertical'、'horizontal'                                                                                     作用:有时候我们使用 better-scroll 在某个方向模拟滚动的时候,希望在另一个方向保留原生的滚动(比如轮播图,我们希望横向模拟横向滚动,而纵向的滚动还是保留原生滚动,我们可以设置 eventPassthrough 为 vertical;相应的,如果我们希望保留横向的原生滚动,可以设置eventPassthrough为 horizontal)。备注:eventPassthrough 的设置会导致其它一些选项配置无效,需要小心使用它。

注意:获取的是内容容器的宽度,而使用better-scroll制造滚动时,获取的是外部 wrapper



报错:

better-scroll报错类似 children undefined的错误,解决:更改dom名称,不要使用swiper-area这样的格式。js中的名称名字要完全一样。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 谢谢作者的文章 非常喜欢 请允许收藏! 博客园首页博问闪存新随笔订阅管理 vue之better-scroll的封装...
    peng凯阅读 16,642评论 2 5
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,693评论 1 92
  • BetterScroll号称目前最好用的移动端滚动插件,因此它的强大之处肯定是存在的。要不...哈哈。个人感觉还是...
    zhanzhan_wu阅读 6,414评论 1 3
  • 凡事预则立,不预则废。 小时候在田间拿镰刀割麦,发现一个有趣的现象:经验丰富的老农总是天蒙蒙亮就起身,吃喝完毕来到...
    群峰阅读 2,325评论 0 0
  • 碧生源牌常菁茶让身体变得异常轻松 我这个人非常的挑剔,对于减肥产品有自己的看法,之前为了确保产品质量,一直都在药店...
    嘉美小喇叭阅读 1,531评论 0 0

友情链接更多精彩内容