滑动卡顿效果

安卓手机打开微信浏览网页,Chrome模拟手机浏览网页,都出现的问题滑动卡顿!

修改代码点:

1、    <style type="text/css">
          * { touch-action: pan-y; }
      </style>

  style加上这个


2、<script>
          window.PointerEvent = undefined;
          document.addEventListener('touchmove', function (e) {
              e.preventDefault();
          }, false);
    </script>

  script加上这两句


3、tabContentScroll = new IScroll("#tabContentWrapper", {
            tap: true,
            probeType: 2,
            deceleration: 0.001,
            vScrollbar: false
        });

  初始化IScroll的时候,加上vScrollbar: false,最关键这句,不加这句,完成其他几点只可以改好Chorme的问题,安卓的问题解决不了!!!


4、iScroll.js 的js文件,找到297/298/299行,将这三个参数按下图修改

  disablePointer:true,
        disableTouch:false,
        disableMouse:true,

  这一点可以参考这个链接 https://github.com/cubiq/iscroll/issues/1100  是官方解释这样修改的


  不要问为什么,反正就是需要这样设置参数,这个问题我搜索了n多才找出来这堆需要修改的地方,网上的解答大多比较旧,都是个其中一个一个参数,但是我用的是iScroll v5.2.0 ,真的缺了一个参数都不行!

  解决后的效果图

关于iScroll在安卓移动端/chrome模拟移动端上下滑动卡顿问题处理!!!!真实可靠!!!已解决!!!的更多相关文章

  1. 移动端web页面滚动不流畅,卡顿闪烁解决方案

    移动端web页面滚动不流畅,卡顿闪烁解决方案   1.ios端的-webkit-overflow-scrolling属性可控制页面滚动效果,设置如下实现惯性滚动和弹性效果: -webkit-overf ...

  2. ☀Chrome模拟移动端浏览器

  3. h5解决移动端上滑卡顿问题

    select{ -webkit-overflow-scrolling: touch;/*解决移动端滑动卡顿问题*/ -webkit-transform: translateZ(0px);/*开启GPU ...

  4. python3 selenuim PC端使用chrome模拟手机进行H5自动化

    情况说明:初次在做PC端使用chrome进行H5自动化测试时,以为和app端自动化一样使用click()就可以对按钮进行点击,找了好几天也没有找到解决方法,有些人说是工程问题,有些人是使用微信进行H5 ...

  5. 在pc游览器端模拟移动端幻灯片

    用简单的思路写了下pc端模拟web端的图片滑动效果... 效果卡,bug多,完毕,继续学习c3方法写这个,iscroll就是可以模拟这种效果,还在学习中,难点<触点判断> 代码一份 < ...

  6. Chrome模拟手机浏览网页

    用Chrome模拟手机浏览网页,只需要编辑一个命令就可以实现 C:\Users\xxx\AppData\Local\Google\Chrome\Application\chrome.exe --use ...

  7. 【转】SoapUI5.0创建WebService接口模拟服务端

    原文:http://blog.csdn.net/a19881029/article/details/26348627 使用SoapUI创建WebService接口模拟服务端需要接口描述文件 MathU ...

  8. 一些java考过的测试题和自己制作模拟服务端和客户端

    媒体 1,java环境变量: PATH: .;%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;  CLASSPATH: .;%JAVA_HOME%\jre\lib\rt.jar ...

  9. Headless Chrome:服务端渲染JS站点的一个方案【上篇】【翻译】

    原文链接:https://developers.google.com/web/tools/puppeteer/articles/ssr 注:由于英文水平有限,没有逐字翻译,可以选择直接阅读原文 tip ...

随机推荐

  1. 机器学习(ML)七之模型选择、欠拟合和过拟合

    训练误差和泛化误差 需要区分训练误差(training error)和泛化误差(generalization error).前者指模型在训练数据集上表现出的误差,后者指模型在任意一个测试数据样本上表现 ...

  2. css实现渐变字体和流光字体

    这是段渐变文本 .text{ font-size: 30px; font-weight: bold; background-image: linear-gradient(#ed3f27, #9b099 ...

  3. Codeforces_803

    A. 填k个1,使矩阵主对角线对称,相同情况选择上面1数量多的. #include<bits/stdc++.h> using namespace std; ][] = {}; int ma ...

  4. Python学习框架(持续更新)

    1.数据类型 整型:整数,1.2.3...这种 浮点型:简单理解就是小数,1.23.3.141572653等等 字符型:“这是字符”,简单说就是我们说的话,都可以作为字符 布尔值:只有2种,true. ...

  5. Go语言实现:【剑指offer】丑数

    该题目来源于牛客网<剑指offer>专题. 把只包含质因子2.3和5的数称作丑数(Ugly Number).例如6.8都是丑数,但14不是,因为它包含质因子7.习惯上我们把1当做是第一个丑 ...

  6. eclipse里新建work set,将项目分组放在不同文件夹

    想必大家的Eclipse里也会有这么多得工程...... 每次工作使用到的项目肯定不会太多...... 每次从这么大数量的工程当中找到自己要使用的, 必须大规模的滚动滚动条......有点不和谐了. ...

  7. node - MongoDB数据库

    mongod 安装配置 在Mongodb官网下载最新版本的Mongodb下载地址 下载msi的window安装包,可以装到C盘或者D盘目录下 配置 由于我是安装在D盘的环境下 D:\Program F ...

  8. 在IDEA中如何使用lombok插件

    lombok 插件 lombok是一款可以精减java代码.提升开发人员生产效率的辅助工具,利用注解在编译期自动生成 setter/getter/toString()/constructor之类的代码 ...

  9. 开源堡垒机jumpserver的安装

    开源跳板机jumpserver安装 简介 Jumpserver 是全球首款完全开源的堡垒机, 使用GNU GPL v2.0 开源协议, 是符合4A 的专业运维审计系统 Jumpserver 使用Pyt ...

  10. postman简单接口测试

    Postman简单接口测试 1. get请求: a. 选择get请求时,地址栏输入地址,如果需要添加参数,可以直接在地址栏加?后面写参数,也可以在点击params添加参数 b. 在headers中添加 ...