在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
主要实现方式为: 先创建id 为location_id的view,然后使用onPageScroll监听该view的位置,当其位置小于0时,设置hideTop = true wxml: <view id='location_id' style=" padding: 0 40rpx; border:1rpx solid #DCDCDC;"></view> <view class="{{ hideTop == true ? 'topnav' : '' }}"> <view class="list-location" bindtap="showLocation">位置 <van-icon name="arrow-down" /> </view> <view style=" margin-top: 20rpx; padding: 0 40rpx; border:1rpx solid #DCDCDC;"></view> </view> .topnav{ position: fixed; top: 0rpx; z-index:99; background: rgb(255,255,255); width: 100%; } //页面滚动监听 onPageScroll: function (e) { let vm = this; var query = wx.createSelectorQuery() query.select('#location_id').boundingClientRect() query.selectViewport().scrollOffset() query.exec(function (res) { if (res[0].top < 0){ //res[0].top为location_id距离顶部的位置 vm.setData({ hideTop: true }) }else{ vm.setData({ hideTop: false }) } }) }, 使用说明: 只要我们把需要的固定的内容放到这个位置,代替就可以了。 <view class="list-location" bindtap="showLocation">位置
<van-icon name="arrow-down" />
</view>
转: https://blog.csdn.net/qq_39142965/article/details/101422729 |
请发表评论