纯CSS3的毫秒倒计时
发布于 5 年前 作者 sxie 3552 次浏览 来自 分享

1. 使用场景:

很多小程序需要使用倒计时功能,可以使用js做秒级倒计,但往往需要到达毫秒级,才能让用户有种紧迫感气氛,如果使用100毫秒setData一次,会是性能大幅度下降,导致页面卡顿。使用gif动图也是一种实现方式,但由于很多地方使用不同的样式倒计时,使用gif维护比较困难。

2. 技术核心:

CSS3帧动画功能,动画的steps()功能

3. 效果演示:

4.代码片段:

https://developers.weixin.qq.com/s/umMJwtmu7vga

5.温馨提示:

来个关注,不定期更新技术文章。

4 回复

点个赞,思路不错

原理解析:

文章里把原理介绍完会更好~

回到顶部