WXML文件






首页
活动
菜单
我的




goods-list


goods-list


goods-list


goods-list




WXS文件
var funcA = function (e, ins) {
// console.log('source is', JSON.stringify(source))
var scrollTop = e.detail.scrollTop
if (scrollTop > 100) {
ins.selectComponent('.page-group').setStyle({
"background-color": 'c'
}).addClass('page-group-position')
ins.selectComponent('.page-banner .image').setStyle({
opacity: 0
})
} else {
ins.selectComponent('.page-group').setStyle({
"background-color": 'rgba(00, 00, 00, ' + Math.max(0, (scrollTop) / 100) + ')'
}).removeClass('page-group-position')
ins.selectComponent('.page-banner .image').setStyle({
opacity: 1 - Math.max(0, (scrollTop) / 100)
})
}
}
module.exports = {
funcA: funcA
}



JS文件
Page({
data: {
sticky: false,
opacity: 0
},
//滚动条监听
_onPageScroll: function (e) {
console.log(5)
},
onShow() {


},
onReady() {}
})




此乃官方demo-滚动菜单栏贴顶，然而并没有达到预期效果
https://developers.weixin.qq.com/miniprogram/dev/framework/view/interactive-animation.html?search-key=touchmove
用滚动监听在安卓端性能非常差，贴顶效果反应迟钝，不流畅

微信小程序开发问题解答

本文网址：http://www.91bianli.com/weixinxiaochengxu/7053.html