评论

微信小程序仿拼多多、京东实现商品详情页顶部导航滚动渐变

动态顶部导航

1.这里使用了自定义导航,然后通过监听动态来改变background的rgba透明值达到效果

2.滚动监听setData是一件很消耗性能的问题,在这里使用了事件节流,及判断了scrollTop

最终特效

代码片段:https://developers.weixin.qq.com/s/KyKkpmmb7hhi



时间紧迫前期只做了动态实现顶部导航渐变,后面会完善动态锚点及锚点监听

原理也很简单 依据 <scroll-view scroll-into-view="{{toView}}" scroll-with-animation="true" scroll-y="true">

既可以实现



最后一次编辑于  2020-05-19  
点赞 8
收藏
评论

1 个评论

  • 李生
    李生
    2021-02-07

    IOS上测试不灵敏,导致效果出不来,用电脑测试的时候看着效果挺好的

    2021-02-07
    赞同
    回复 1
    • 猛男陈阔
      猛男陈阔
      2021-02-08
      卡顿吗?
      2021-02-08
      回复
登录 后发表内容