这几天做小程序,有些页面都是全屏的背景,在安卓上背景是固定的,而在ios上上拉下拉出现白
ios系统滑动页面有个弹簧效果,App上一般滑动视图有个bounce属性,设置为NO就可以了 ,但是小程序在苹果手机上运行,页面滑动也会有弹簧效果,同时有看见一个白色背景,这个背景色并不能通过设置页面page背景色去掉,想要滑动视图的时候看不到白色背景,可以按照下面的方法
方式一:
可以在page.json文件内配置 :"backgroundColor": "#ccc" 属性,这个方法比较便捷。但是对于一些全屏背景的页面体验还不是很好
方式二:
对于一些全屏背景页面,我们可以让背景固定这样体验会好点,可以按以下进行操作:
1》page.json设置 "disableScroll":true ; 表示:设置为 true 则页面整体不能上下滚动;只在 page.json 中有效,无法在 app.json 中设置该项
2》对于一些页面内容太多,需要页面需要上下滑动的可以在page.wxml页面这么处理
<scroll-view scroll-y style="height:{{wh}}px;" bindscrolltolower="onBottom">
</scroll-view>
3》page.js
wx.getSystemInfo({
success: function (res) {
that.setData({
"wh": res.windowHeight
})
}
})
4》全屏背景样式
可以设置页面背景色
page{background: url(xxx.png) no-repeat center center fixed;background-size: cover; }