項目要求：
如圖所示，當頁面滾動到導航條到達搜索欄下方時固定，向上滾動到導航條位置時又恢復原樣。
以下是代碼展示：
1.wxml
<scroll-view style="width:100%;height: 100%;" scroll-y="true" bindscroll="scrollTopFun"> <view class="{{top>130 ? 'topnav' : ''}}"> <--這里寫大于130，表示距離頂部130rpx時固定，可根據需要修改--> ... </view></scroll-view>2.wxss
.topnav{ position: fixed; top: 85rpx; z-index:99; background: #fff; width: 100%;}3.js
data = { top:0}//控制回到頂部按鈕的顯示與消失scrollTopFun(e){ let that = this; that.top = e.detail.scrollTop; that.$apply();}其實整個思路很簡單， 小程序自帶的組件scroll-view自帶有屬性bindscroll（滾動時觸發）。通過這個屬性獲取瀏覽器滾動條距離頂部的位置，通過這個位置判斷class類的顯示就可以了。
以上所述是小編給大家介紹的微信小程序--特定區域滾動到頂部時固定的方法詳解整合，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持！
新聞熱點
疑難解答
