h5页面对于ios系统在浏览器中存在橡皮筋拉伸行为的优化处理

问题:所做的h5页面在公司app中以及微信等浏览器中存在拉伸时出现滑动卡顿,向下拉升底部或者向上滑动顶部出现微信浏览器自带灰黑色背景以及由于布局出现的body背景颜色。

解决方法:

采用iNoBounce.js,

git地址:https://github.com/lazd/iNoBounce

使用方法:在需要滚动滑动的元素上加上height或者max-height,overflow:auto,以及-webkit-overflow-scrolling:touch这三要素,即可解决拉伸出现app自带背景或者微信等浏览器自带灰黑色背景,但可能由于我用的框架问题(用的sui框架),仍然会出现H5页面本身所带的背景,不过可以将背景颜色设置为透明或者白色,倒也不是影响很大,另外最初对于这个问题本来想做到能够使H5页面上下固定,不存在橡皮筋类似的拉伸效果,有的人说只要不使用-webkit-overflow-scrolling:touch这个就不会出现这种拉伸效果,但是由于使用的框架以及本身能力问题,无法做到。如果有好的方法或者能做到的朋友方便的话私信下,被暂时打败的说。o(╥﹏╥)o


阅读更多
文章标签: H5 插件
个人分类: H5
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

不良信息举报

h5页面对于ios系统在浏览器中存在橡皮筋拉伸行为的优化处理

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭