跳至主要內容
  • Hostloc 空間訪問刷分
  • 售賣場
  • 廣告位
  • 賣站?

4563博客

全新的繁體中文 WordPress 網站
  • 首頁
  • 请教前端大大们一个小程序的效果实现方法
未分類
4 4 月 2021

请教前端大大们一个小程序的效果实现方法

请教前端大大们一个小程序的效果实现方法

資深大佬 : cyy564 0

http://static.cangyuanyuan.com/ezgif.com-gif-maker.gif

直接上图,看准网的小程序

吸顶可以用 createIntersectionObserver 来实现

下滑过程中 logo 和搜索框如何实现如此平滑的变化效果

用了 onPageScroll,效果很差

有木有更好的方法

还有一点,我用的 taro,没用原生

大佬有話說 (10)

  • 資深大佬 : heasy

    https://developers.weixin.qq.com/miniprogram/dev/api/ui/animation/Animation.scale.html

  • 主 資深大佬 : cyy564

    @heasy 他那个是根据高度进行缩放,我想知道如何监听用户下滑到一定的高度,然后再进行动画

  • 資深大佬 : ibegyourpardon

    小程序的 onPageScroll 我没用过,目测和浏览器环境下用法差不多。

    使用 onPageScroll()方法,该函数有一个参数 e,通过 e.scrollTop 可以访问你所滚动的高度。

    onPageScroll: function(e) {
    console.log(e.scrollTop)
    }

    你可以计算 e.scrollTop 来决定要不要开始执行动画。
    但应该不能在里面用不停的去 setData 的方法来做,会有严重的性能问题。它更应该是一个触发开关,开关打开后去调一次动画。

  • 資深大佬 : misdake

    https://developers.weixin.qq.com/miniprogram/dev/framework/view/animation.html#%E6%BB%9A%E5%8A%A8%E9%A9%B1%E5%8A%A8%E7%9A%84%E5%8A%A8%E7%94%BB

  • 資深大佬 : qiayue

    @misdake 居然真有这接口

  • 資深大佬 : loveToMy1

    占个 我也在找

  • 資深大佬 : journalistFromHK

    animate keyframes 吧

  • 主 資深大佬 : cyy564

    @misdake 谢谢,看了一下样例,就是这种效果

  • 資深大佬 : play78

    six

  • 資深大佬 : coreki

    刚好我最近也在做这个效果

文章導覽

上一篇文章
下一篇文章

AD

其他操作

  • 登入
  • 訂閱網站內容的資訊提供
  • 訂閱留言的資訊提供
  • WordPress.org 台灣繁體中文

51la

4563博客

全新的繁體中文 WordPress 網站
返回頂端
本站採用 WordPress 建置 | 佈景主題採用 GretaThemes 所設計的 Memory
4563博客
  • Hostloc 空間訪問刷分
  • 售賣場
  • 廣告位
  • 賣站?
在這裡新增小工具