【bug】—— H5页面在 ios 端滑动不流畅的问题

 

IOS系统的惯性滑动效果非常6,但是当我们对div加overflow-y:auto;后是不会出这个效果的,滑动的时候会感觉很生涩。怎么办?

方案一:

在滚动容器内加-webkit-overflow-scrolling: touch

但这个方案有一个问题,在页面内具有多个overflow:auto的情况下,那些具有 绝对定位(absolute, fixed) 属性的元素,也会跟着滚动。

方案二:

body {overflow-x: hidden}

即,给 body 元素添加overflow-x:hidden。然后在滚动容器内加overflow-y: auto

解决overflow: auto在Ios中滑动不流畅的更多相关文章

  1. 【解决ViewPager在大屏上滑动不流畅】 设置ViewPager滑动翻页距离

    在项目中做了一个ViewPager+Fragment滑动翻页的效果,在模拟器和小米手机上测试也比较正常.但是换到4.7以上屏幕测试的时候发现老是滑动失效. 因为系统默认的滑动策略是当用户滑动超过半屏之 ...

  2. ios浮层滑动不流畅解决方案

    前段时间做了一个浮层,但在ios上,浮层滑动不流畅,基本上是随着手指的移动而移动,经研究加上-webkit-overflow-scrolling: touch即可 eg: <!DOCTYPE h ...

  3. 解决移动端在IOS中input输入框光标过长

    在输入框样式中加入: line-height:20px;

  4. html页面在苹果手机内,safari浏览器,微信中滑动不流畅问题解决方案

    1. -webkit-overflow-scrolling:touch是什么? MDN上是这样定义的: -webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效 ...

  5. 【bug】—— H5页面在 ios 端滑动不流畅的问题

    IOS系统的惯性滑动效果非常6,但是当我们对div加overflow-y:auto;后是不会出这个效果的,滑动的时候会感觉很生涩.怎么办? 方案一: 在滚动容器内加-webkit-overflow-s ...

  6. overflow:scroll 在 iOS上滚动不流畅的问题

    添加下面属性: -webkit-overflow-scrolling: touch;

  7. 解决iPhone滑动不流畅问题

    前段时间在做一个手机端的页面时遇到了iOS上滑动不流畅的问题,后来才发现安卓上没有问题,才意识到这是兼容性问题引起的,所以遇到问题后快速定位到问题根源非常重要.在网上一搜就找到了解决方案.以后遇到类似 ...

  8. ios下元素溢出设置 overflow:auto; 不能滑动解决办法

    ios下元素溢出设置 overflow:auto; 不能滑动解决办法: overflow:auto; overflow-y:scroll; -webkit-overflow-scrolling:tou ...

  9. 解决页面使用overflow: scroll,overflow-y:hidden在iOS上滑动卡顿的问题

    解决页面使用overflow: scroll,overflow-y:hidden在iOS上滑动卡顿的问题 div{ width: 100%; overflow-y: hidden; -webkit-o ...

随机推荐

  1. 第 1 章 第 1 题 高级语言的排序问题 C++标准算法实现

    问题分析 依题意,所需程序不用过多考虑效率且暗示使用库,自然想到用高级语言实现(个人选择C++).可用顺序容器暂存数据,用标准算法解决排序问题. 代码实现 #include <iostream& ...

  2. ffmpeg下载rtmp flv

    ffmpeg -i rtmp://shanghai.chinatax.gov.cn:1935/fmsApp/16a0148f117.flv -c copy dump.flv

  3. React Native学习(二)之View

    React Native组件解析(二)之View 0.JSX React的核心机制之一就是虚拟DOM:可以在内存中创建的虚拟DOM元素.React利用虚拟DOM来减少对实际DOM的操作从而提升性能. ...

  4. 九度OJ 1109:连通图 (最小生成树)

    时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:2783 解决:1432 题目描述: 给定一个无向图和其中的所有边,判断这个图是否所有顶点都是连通的. 输入: 每组数据的第一行是两个整数 n ...

  5. 九度OJ 1099:后缀子串排序 (排序)

    时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:3439 解决:1491 题目描述: 对于一个字符串,将其后缀子串进行排序,例如grain 其子串有: grain  rain  ain  i ...

  6. window.onerror 错误监听,发到后台

    var doc = document.body || document.documentElement; var _onerror = Onerror(''); var Onerror = funct ...

  7. IDEA 打开多个项目

    简单的说只需要以下几步: 1.将需要同时打开的模块放在一个文件夹下,e.g. AModel 和 BModel 同时放在 Project 文件夹下. 2.在 IDEA 初始导入项目页面选择 open - ...

  8. hdu1078 FatMouse and Cheese —— 记忆化搜索

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1078 代码1: #include<stdio.h>//hdu 1078 记忆化搜索 #in ...

  9. ansible使用中遇到的问题

    前提是,可以ssh无秘钥过去,但是使用ansible就报这个错误, 正在找造成的原因及解决方法 第一步, 明白了,,如何已经打通ssh无秘钥后,就不能再 hosts中加入ansible_ssh_pas ...

  10. hibernate入门(-)

    1.struts2的支持 在web.xml中配置struts2的支持 <?xml version="1.0" encoding="UTF-8"?> ...