ios web端滚动页面有粘黏的情况

现象:
使用iphone6 plus、iphone7 plus、iphone6s plus,在上拉检索商品的页面,页面是每20件商品显示一页,到底后,上拉加载下一页的商品数据。快速想上滑动,当滑动一定的页面数之后(具体视情况而定),会偶尔出现页面粘黏,无法滑动的场合。并不是每次都会出现这种情况。

页面是使用react.js构造的单页面应用。

问题:
现在问题的定位点有些不清楚
(1)从目前的状况看,安卓侧是没有出现这个问题,只有ios侧会出现这种问题,是否是因为ios系统本身会有这个粘黏的问题;
(2)需要翻动到一定的页面数才会出现这种情况,但是并不是很大几率;
(3)滚动页面dom的构成是div+div去做的,并没有通过流行的div + ul + li这种标签构造滚动页面dom,是否用div+div这种方式有隐藏的问题;
(4)使用react.js去渲染页面,是否因为利用不当造成了这种页面粘黏的情况,即javascript的处理造成的;

以上的问题,如果有遇到并且解决过的,请帮忙了。

阅读 3.5k
2 个回答

这种情况应该是因为使用了-webkit-overflow-scrolling:touch属性导致的,webview会为添加了此属性的元素添加一层进行渲染。但是不使用这个属性又会导致页面不流畅,所以我当前的解决方法是使用transfrom模拟滚动的插件,不需要-webkit-overflow-scrolling:touch属性,但是缺点是性能问题大,有卡帧现象;

新手上路,请多包涵

-webkit-overflow-scrolling:touch 是这个属性问题,我的解决办法是去掉,然后用body自带的滚动条

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题