ios闪屏bug,使用-webkit-overflow-scrolling: touch;属性结合css3动画做的h5

webJWYC 2017-12-06 10:02:50
最近做的微信h5项目页面使用比较多的css3的动画,在使用了-webkit-overflow-scrolling: touch;之后个别页面后会在ios下出现闪屏的bug,不知道有没有大神知道这个bug和ios的性能是不是有关呢?请指点一二,具体问题描述如下:
1、该h5项目是在微信下使用而且是个单页面网页应用;
2、页面使用了css3的动画,包括transition过渡动画和animation动画(translateX这类的样式都有使用到);
3、页面长页面使用了overflow:auto;
4、为了是ios滑动顺滑在有overflow:auto的地方加了样式-webkit-overflow-scrolling: touch;(加了之后ios会出现闪屏的页面,但不是所有加了这个属性的页面都会闪屏,这里所说的页面不是指的跳转的页面,而是单页面里面区分的页面);
5、使用的ios的设备版本为9.3.4以上的;

希望知道详情的大神可以做下详细讲解,让后面的新人能少踩这个坑,万分感谢
...全文
2266 1 打赏 收藏 转发到动态 举报
写回复
用AI写文章
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
沿着路走到底 2018-01-21
  • 打赏
  • 举报
回复
你看下闪屏的页面是不是都修改了 scrollTop? 可以在修改之前修改css -webkit-overflow-scrolling: touch;为 -webkit-overflow-scrolling: auto; scrollTop修改后再改回touch

29,027

社区成员

发帖
与我相关
我的任务
社区描述
主要讨论与iOS相关的软件和技术
社区管理员
  • iOS
  • 大熊猫侯佩
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧