小程序 - - - - - 实现渐隐渐显（监听滚动距离版）

代码如下：

 <!-- fixed-left -->
<view class="fixed-box" animation="{{animationData}}">这里是渐隐渐显的标签
</view>

.fixed-box {position: fixed;left: 0;top: 0;z-index: 999;background-color: #ccc;/* background-color: #f9f9f9; */width: 100%;height: 90rpx;line-height: 90rpx;padding: 0rpx 30rpx;padding-top: 8rpx;box-sizing: border-box;display: flex;align-items: center;opacity: 0;
}

data:{animationData: {},fixedShow: false,
},/*** Monitor the scrolling distance and display animation* @param {*} event */onPageScroll(event) {const scrollTop = event.scrollTop;if (scrollTop < 440 && this.data.fixedShow) {this.fadeOut();} else if (scrollTop >= 440 && !this.data.fixedShow) {this.fadeIn();}},fadeIn: function () {const animation = this.animation;animation.opacity(1).step();this.setData({animationData: animation.export(),fixedShow: true});},fadeOut: function () {const animation = this.animation;animation.opacity(0).step();this.setData({animationData: animation.export(),fixedShow: false});}