使用sticky实现悬浮按钮滑到"底部"隐藏
发布于 3 年前 作者 fang22 1958 次浏览 来自 分享

一、目标效果

页面上悬浮着【立即购买】,但用户点击立即购买,滚动到底部(或用户滑动到底部)时,隐藏【立即购买】。

二、之前的思路

先获取表单距离顶部距离,在onPageScroll里监听当前滚动距离,如果滚动距离 > 表单距离就隐藏【立即购买】,反之则显示,需要频繁监听滚动距离。

三、现在的思路

使用 sticky 做层级隐藏。

四、 代码片段

https://developers.weixin.qq.com/s/15MGPOmD7Ert

五、温馨提示

  1. 公司在自行开发、运营电商小程序,欢迎交流共同进步。
  2. 不定期分享文章,欢迎关注哈。


回到顶部