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

【bug】—— H5页面在 ios 端滑动不流畅的问题的更多相关文章

  1. 解决overflow: auto在Ios中滑动不流畅

    [bug]—— H5页面在 ios 端滑动不流畅的问题   IOS系统的惯性滑动效果非常6,但是当我们对div加overflow-y:auto;后是不会出这个效果的,滑动的时候会感觉很生涩.怎么办? ...

  2. 混合app开发，h5页面调用ios原生APP的接口

    混合APP开发中,前端开发H5页面,不免会把兼容性拉进来,在做页面的兼容性同事,会与原生app产生一些数据交互: 混合APP开发,安卓的兼容性倒是好说,安卓使用是chrome浏览器核心,已经很好兼容H ...

  3. H5 页面在微信端的分享

    微信分享,咋一看好像很复杂,实则非常简单.只需要调用微信官方出的微信jssdk,加上些许配置,就可以实现h5页面在微信上的分享,官方文档地址为: https://mp.weixin.qq.com/wi ...

  4. H5页面在微信端的分享

    微信分享,咋一看好像很复杂,实则非常简单.只需要调用微信官方出的微信jssdk,加上些许配置,就可以实现h5页面在微信上的分享,官方文档地址为:https://mp.weixin.qq.com/wik ...

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

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

  6. app内嵌h5页面在ios手机端滑动卡顿的解决方法

    1.带滚动条的dom需加样式 -webkit-overflow-scrolling: touch;2.去掉 width:100%; height:100%

  7. h5页面在ios机上禁止长按复制

    (注意,增加之后需要对input的另外设置,不然输入框无法输入)场景:H5出现一个按钮需要长按几秒展示动画的,如:skcs.net-tactic.com/wap/peace/index,这时就需要用到 ...

  8. H5页面解决IOS进入不自动播放问题（微信内）

    废话少说,直接上代码. 主要还是调用微信的jdk做兼容处理.,安卓可自动播放. ($(function(){ $(function(){ /* ** 复选框*/ $('.ul-radio').on(' ...

  9. h5页面判断微信端用浏览器打开代码

    <div class="weixin-tip"> <p> <img src="img/live_weixin.png" alt=& ...

随机推荐

  1. win7局域网内共享文件夹及安全设置

    右键想要共享的文件夹,选择属性. 在文件夹属性对话框中选择共享标签,如图: 点击共享按钮,弹出文件共享对话框. 添加 Everyone ,并根据实际需要修改权限.权限可以是读取 或 读取/写入. 到此 ...

  2. NBU 还原windows ORACLE数据库(BW)

    将0.92数据库还原到1.92,还原时间7月13日 1.查询所需要的控制日志 bplist -C bw-prd01 -s -- -e -- -k oracle_bw-prd01_0_92_arch - ...

  3. 74. Search a 2D Matrix (Graph; Divide-and-Conquer)

    Write an efficient algorithm that searches for a value in an m x n matrix. This matrix has the follo ...

  4. MongoDB--CSharp Driver Quickstart .

    原文链接 http://www.mongodb.org/display/DOCS/CSharp+Driver+Quickstart?showComments=true&showCommentA ...

  5. Java 设计模式系列（二二）责任链模式

    Java 设计模式系列(二二)责任链模式 责任链模式是一种对象的行为模式.在责任链模式里,很多对象由每一个对象对其下家的引用而连接起来形成一条链.请求在这个链上传递,直到链上的某一个对象决定处理此请求 ...

  6. Java Thread系列（十）生产者消费者模式

    Java Thread系列(十)生产者消费者模式 生产者消费者问题(producer-consumer problem),是一个多线程同步问题的经典案例.该问题描述了两个共亨固定大小缓冲区的线程-即所 ...

  7. sqlserver 2017 linux还原windows备份时的路径问题解决

    windows的备份由于路径问题,在Linux上会报错 File 'YourDB_Product' cannot be restored to 'Z:\Microsoft SQL Server\MSS ...

  8. Jakarta Commons Cookbook

      Cookbook就是工具书,应该是前年看的,在中关村看的影印版,全英文,本书主要讲解了一下模块: Core:BeanUtils,Lang,Collections,logging Db:DbUtil ...

  9. 2014 ACM/ICPC 鞍山赛区网络赛（清华命题）

    为迎接10月17号清华命题的鞍山现场赛 杭电上的题目 Biconnected(hdu4997)     状态压缩DP Rotate(hdu4998)    相对任一点的旋转 Overt(hdu4999 ...

  10. java如何集成支付宝移动快捷支付功能

    项目需要,需要在客户端集成支付宝接口.第一次集成,过程还是挺简单的,不过由于支付宝官方文档写的不够清晰,也是走了一些弯路,下面把过程写出来分享给大家.就研究了一下:因为使用支付宝接口,就需要到支付宝官 ...