关于在小程序内使用动画的分享
发布于 3 年前 作者 kwen 5118 次浏览 来自 分享

关于在小程序内使用动画的分享

~

首先声明,文中的动画仅仅是一些小的元素animate,而不是小游戏那种动画

~

其次我个人在动画这块的开发积累有限,也是近期对这个比较感兴趣想学习下

起源

前几天我在体验某小程序的时候,小程序的下一题滑动效果很绚丽,我想模仿下实现,但是百思不得解,但是从此之后在内心种下了想要学习动画的种子

这几天在看腾讯官方的推送有一个答题的H5页面,

里面有很多的效果都是我苦苦寻找的,里面包括duangduang、左侧划出、底部划出、右侧划出、缩放闪现,都是我非常期待的动画效果

~

~

~

~

趁这个机会,我把里面的代码拆解学习了一番,后面发现,这个页面使用了一个开源的动画库,也就是本文想要推荐的

https://animate.style/

总结

答题活动小程序产品一直是我不断求索和摸索的,从行业角度讲属于答题,从运营角度讲属于活动

作为活动,那就要一个绚丽的效果以足够吸引用户

所以给答题活动小程序增加动态的动画效果也是我未来的一个方向和趋势,十分值得期待

~

1 回复

animate.css 是一个来自国外的 CSS3 动画库,它预设了

抖动(shake)、

闪烁(flash)、

弹跳(bounce)、

翻转(flip)、

旋转(rotateIn/rotateOut)、

淡入淡出(fadeIn/fadeOut)

等多达 60 多种动画效果,几乎包含了所有常见的动画效果。

回到顶部