小米商城商品详情页这种动画效果是怎么做出来的

Charlotte0924
  • 182

很好奇这种随着页面下拉图片和文字动画是怎么做出来的,用的是animation或者transition实现的吗?用的是类似opacity:0变到1这种方法?哪位大佬知道哪里有学制作这种页面效果的相关教程,谢啦!

image

回复
阅读 1.9k
5 个回答

animation同时改透明度和top值
前几天模仿这个链接在小程序做了一个demo 感觉和小米的大同小异吧

控制台打开看不就知道了,用的transition

特意去看了下小米商城,把代码给抄出来了,用的是transition 和 opacity
网上搜搜这两个关键字,在结合小米商城的源码,可以学习学习,我也是临时看的,具体实现还得你自己慢慢研究。
image.png

用wow.js这个库,可以直接实现这个效果,只需要加一些class类名就行

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏