【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. 目标检测之harr---角点检测harr 的opencv实现

    本系列文章由@浅墨_毛星云 出品,转载请注明出处. 文章链接: http://blog.csdn.net/poem_qianmo/article/details/29356187 作者:毛星云(浅墨) ...

  2. 九度OJ 1100：最短路径 （最短路径）

    时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:4185 解决:619 题目描述: N个城市,标号从0到N-1,M条道路,第K条道路(K从0开始)的长度为2^K,求编号为0的城市到其他城市的 ...

  3. yuicompressor

      yui/yuicompressor: YUI Compressor https://github.com/yui/yuicompressor    YUI Compressor 详细介绍 YUI ...

  4. [P2769] 猴子上树

    题目描述 在猴村有一条笔直的山路,这条山路很窄,宽度忽略不计.有 n只猴子正站在山路上静静地观望今天来参加比赛的各位同学.用一个正整数Xi表示第i只猴子所站位置,任意两只猴子的所站位置互不相同.在这条 ...

  5. 关于Fragment的onActivityResult 不执行

    1.getActivity().startActivityForResult();  与 fragment.startActivityForActivity(): getActivity().star ...

  6. UVA12293 Box Game —— SG博弈

    题目链接:https://vjudge.net/problem/UVA-12293 题意: 两人玩游戏,有两个盒子,开始时第一个盒子装了n个球, 第二个盒子装了一个球.每次操作都将刷量少的盒子的球倒掉 ...

  7. Django_model进阶

    Django-model进阶   QuerySet 可切片 使用Python 的切片语法来限制查询集记录的数目 .它等同于SQL 的LIMIT 和OFFSET 子句. >>> Ent ...

  8. spring mvc提交日期类型参数

    如题,spring mvc直接提交Date类型参数会报错,400 bad request的错误.在controller里加上 @InitBinder protected void initBinder ...

  9. php排序方法之插入排序

    //插入排序法 $arr = array(3,55,45,2,67,76,6.7,-65,85,4); function insertSort($arr){ for ( $i=0; $i<cou ...

  10. Linux下监控网卡流量的软件iftop

    官网上说使用iftop需要libpcap和libcurses这两个包. 用命令查找了一下 #  rpm -qa | grep libpcap libpcap-0.9.4-15.el5 只找到了这个,缺 ...