小程序某标签滚动到某个位置时，固定在页面顶部

效果：我不知怎么上传视频效果。。。

方式一：用于要固定的元素前面的内容高度无法确定的情况下

js：代码

说明：这里选的指定元素不是导航栏本身，而是导航栏下面可滚动的内容，因为如果选择导航栏的话，它固定到顶部之后就无法恢复（因为它无法滑动，top值无法改变）。

//监听页面滚动
    onPageScroll:function(e){
        //获取指定元素距离页面顶部的距离
        let query = wx.createSelectorQuery();
        query.select('#nav').boundingClientRect((rect) =>{
            let top = rect.top;
            console.log(top);
            if(top<=45){  //这个45视情况而定
                this.setData({
                    fixedNav:true
                })
            }else{
                this.setData({
                    fixedNav: false
                })
            }
        }).exec()
    },

wxml:

        
            楼盘概况 
            户型图 
            位置及周边 
        
        
            
            
                nav1内容
            
            
            
                nav2内容
            
            
            
                nav3内容
            
        
    

样式：

.totop{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color:#fff; 
}

方式二：用于要固定的元素前面的元素高度是固定的，以后维护不会改变的情况

主要区别在js:

//监听页面滚动
    onPageScroll:function(e){
        this.setData({
            scrollTop: e.scrollTop
        })
    },

wxml:（442视情况而定，就是要固定的元素前面内容的总高度）

​

        
            楼盘概况 
            户型图 
            位置及周边 
        
        
            
            
                nav1内容
            
            
            
                nav2内容
            
            
            
                nav3内容
            
        
    

​