有时,在页面中添加字体移动旋转效果,一定程度上可以吸引用户,以达到停留页面的目的
在css3中虽然transiton在一定的时间内可以实现元素的初始状态在指定的时间范围过度到最终状态
用于模拟一种过渡动画的效果,但它的功能是有限的,在css3中的animation属性,结合@keyframes实现更复杂的动画效果
示例效果
应用场景
- 在网页或小程序,app中某个位置处嵌入文字抖动效果,可以吸引用户注意,增强页面趣味
- 延长用户在网站停留时间,可以对文字添加链接或导航,引导用户跳转到指定的地方去
- 纯css3实现,动画帧的实现,性能超好,文字随意更改,源码效果自由可调(需要有一定的前端技术基础)
- 使用研究css3新特性,在往后的项目中,在适当的场景页面中,特殊位置处引入
技术实现
通过css3中提供的一个关键帧@keyframes声明动画与animation调用关键帧动画两者进行实现的
源码下载
© 版权声明
文章版权归作者所有，未经允许请勿转载。
THE END
