• BetterScroll使用


    IScroll需要关注的问题太多,甚至有些企业微信电脑端无法滑动,同样的win10同样的企业微信版本不同的电脑有时都不行,查不出来原因,今天决定把他换了试验下,首先技术选型

    1、MeScroll

    http://www.mescroll.com/

    2、BetterScroll

    https://github.com/ustbhuangyi/better-scroll

    首先使用Mescroll,官网做的不错,但是在Jquery方式下,直接替换不太成功,感觉和Iscroll差别较大,改使用BetterScroll

    3、固定列表用法示例

    <script src="https://unpkg.com/@better-scroll/core@latest/dist/core.min.js"></script>
    
    let wrapper = document.getElementById("wrapper")
    let bs = new BScroll(wrapper, {})
    
    <div class="wrapper">
      <ul class="content">
        <li>...</li>
        <li>...</li>
        ...
      </ul>
      <!-- you can put some other DOMs here, it won't affect the scrolling
    </div> 

    4、使用例子

     let wrapper = document.getElementById("wrapper")
                if (myScroll == null || myScroll == undefined) {
                    myScroll = BetterScroll.createBScroll(wrapper, {
                        click: true, taps: true, pullUpLoad: {
                            threshold: 10
                        }
                    });
                    myScroll.on('pullingUp', function () {
                        $("#divscroll").height('');
                        $("#divscroll").height($("#divscroll").height() + 20);
                        myScroll.refresh();
                        myScroll.finishPullUp();
                    })
                } else {
                    $("#divscroll").height('');
                    $("#divscroll").height($("#divscroll").height() + 20);
                    myScroll.refresh();
                }
    

      

    4、感觉BetterScroll滚动效果不如IScroll,观察客户电脑手机情况中。 

    后续:IScroll出现的问题,BetterScroll依然有,没有客户的环境,暂时无解  

  • 相关阅读:
    php 基础------数组过滤
    js或者jq 使用cookie 时在谷歌浏览器不好使
    css3 -阻止元素成为鼠标事件目标 pointer-events
    CSS3-----transform 转换
    css3---过渡
    css3动画----animation
    移动端尺寸适配--媒体查询
    工作一年总结
    关于Jquery.Data()和HTML标签的data-*属性
    android shape
  • 原文地址:https://www.cnblogs.com/zhaogaojian/p/13921993.html
Copyright © 2020-2023  润新知