h5页面在ios中不能滑动/滑动的不流畅

一、页面不滑动
例如:(原生app内嵌h5页面)当页面有fixed定位,在ios某些系统(ios 11.1.2、12.1.2)会造成页面不能滑动,
处理方式:(如下仅供参考)

1.jpg

2.jpg

3.jpg

此处act为最外层box,btn为固定在右下角的按钮;惯性思维大概就是直接给按钮fixed定位,直接明了,但是ios对position:fixed;支持度极差,因此,最好的方法是换一种写法,假如btn的父级的视图窗口也像浏览器的窗口一样的大小的话,使用绝对定位position:absolute; 最后的效果也能够达到;那就是给父级宽高100%;就可以了;

二、滑动不流畅
处理方式:
在需要滑动的元素上添加如下的css属性:
height:100%;
overflow-Y:scroll;
-webkit-overflow-scrolling:touch;

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,790评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,610评论 1 45
  • mobileHack 这里收集了许多移动端上遇到的各种坑与相对解决方案 工具类网站 HTML5 与 CSS3 技术...
    Zoemings阅读 6,553评论 0 12
  • Mobile Web Favorites 参与贡献 移动前端开发收藏夹,欢迎使用Issues以及 Pull Req...
    柴东啊阅读 760评论 0 2
  • 关于css常见问题,大多是移动端的。 简单的排版规则:条目与条目之间空两行,每条内容部分分段空一行。标点符号全部用...
    苏水儿阅读 5,043评论 0 9