![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
requestAnimationFrame运动框架
文章平均质量分 89
观察蚂蚁的人
这个作者很懒,什么都没留下…
展开
-
requestAnimationFrame运动框架实现-果冻效果
会逃跑的“果冻”,响应鼠标、触屏事件。原创 2022-04-12 03:58:11 · 519 阅读 · 4 评论 -
web版“节奏猜猜看“小工具-Web Workers+requestAnimationFrame+transition
web版“节奏猜猜看”,可以通过电脑或手机的浏览器训练节奏,还可以充当简易节拍器(目前只支持4/4拍)原创 2022-04-09 17:24:26 · 1328 阅读 · 4 评论 -
requestAnimationFrame运动框架实现播放中连续变速动画效果
上篇专题已介绍requestAnimationFrame运动框架的基本概念和特性,这次要进一步对运动框架的用途进行挖掘。比如,能连续响应速度变化的前端动画效果。说道制作前端动效,很容易想到keyframes关键帧,尤其是循环播放,流畅又简洁。为何不用关键帧来完成该效果呢?的确,关键帧动画可以在播放同时调整速度,通过JavaScript调整速度属性style.animationDuration的值来改变快慢。实际应用的时候问题出现了,本以为keyframes关键帧会随着animationDuratio原创 2022-04-04 20:37:54 · 2193 阅读 · 8 评论 -
requestAnimationFrame运动框架基本概念+运动框架应用于web页面的抗阻塞均匀计数器
前端计时器是经常用到的知识点,基于JavaScript单线程的特性,setInterval计数器在阻塞干扰下间隔会变得不均匀,虽然已经有现成的解决方法,通常是将阻塞延迟的时间在下一个计时周期中调整过来,但并不能治本,所以才推荐用requestAnimationFrame运动框架做计数器,达到在阻塞干扰的情况下依然均匀运作的效果。原创 2022-03-29 00:31:26 · 2118 阅读 · 13 评论