添加一个属性:
-webkit-overflow-scrolling: touch
-webkit-overflow-scrolling控制元素在移动设备上面是否有滚动回弹效果,它可以设置成auto和touch
IOS 端特属属性,手指离开屏幕会保持滚动一段距离,继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。
overflow: scroll; //该属性随着手指离开立即停止 -webkit-overflow-scrolling: touch; //该属性随着手指离开还会保持滚动 overflow-scrolling: touch; |
1.嵌入的iframe页面无法滚动
在iframe外层包裹一个div,然后将其设置为可滚动
<div style="webkit-overflow-scrolling: touch;overflow-y: scroll;">
<iframe></iframe>
</div>
并且在禁止浏览器的默认行为,不然类似于微信滑动到底部的时候会和回弹的效果进行冲突
$('body').on('touchmove',function(e){
e.preventDefault();
});
可以参考的博客:
https://blog.csdn.net/qq_43071910/article/details/83893324
https://blog.csdn.net/tinsine/article/details/79523060
这些没有细看,但应该也有很好的参考价值:
https://www.jianshu.com/p/1f4693d0ad2d
https://blog.csdn.net/qq_35458527/article/details/79543565