アプレットはページをスクロールして、ナビゲーション バーの背景色を変更します。

ページのデザインは次のようになります。

ページのスクロール効果は次のようになります。ナビゲーション バーのタイトルがブロックされ、

特定の領域までスクロールした後に最終的に背景色が表示されます。

jsコード

  onPageScroll: function (e) {
    
     // 获取滚动条当前位置
    if (e.scrollTop > 50) {
    
    
      this.data.rgb == 1 ? '' : this.setData({
    
    
        rgb: 1
      })
    } else {
    
    
      this.data.rgb == 0 ? '' : this.setData({
    
    
        rgb: 0
      })
    }
  },

wxmlページ