美文网首页前端攻城狮
关于js动画和css3动画的差异性你了解吗?请简单谈一下

关于js动画和css3动画的差异性你了解吗?请简单谈一下

作者: 黄一倚 | 来源:发表于2019-04-14 09:01 被阅读16次

css3动画:css3之后添加了transform动画计算函数,所以实现动画更为简单方便,并且transform矩阵是C++级的计算,所以速度会快很多。但是动画控制上不是特别灵活,部分动画无法实现(比如轮播图,视差滚动都需要js去参与)并且兼容性也存在一定问题。

js动画:一般可以使用requestAnimationFrame去实现,js动画相对css3动画来说,控制力更强一些,可以单帧的控制变换,同时可以兼容到IE6版本的浏览器,并且功能非常强大,但是它编码较为繁琐,并且运算预渲染性能都不如css3动画。

所以,综合考虑,简单的交互动画就用css3实现,控制比较复杂、比较繁琐的交互动画可以交由js实现。

相关文章

  • 关于js动画和css3动画的差异性你了解吗?请简单谈一下

    css3动画:css3之后添加了transform动画计算函数,所以实现动画更为简单方便,并且transform矩...

  • AnimationEnd 事件侦听

    CSS3 动画结束时是有触发事件的,这个之前竟然不了解。。除了JS动画如果做纯css3动画的时候使用 delay ...

  • 微信小程序Animation动画的使用

    1,前言 和css3动画不同,小程序中动画是主要是通过js控制的,简单来说就是创建一个动画实例animation。...

  • 复习

    动画历史回顾:gif动画->flash动画->js动画->css3动画 过渡动画(即补间动画):用于实现两种状态的...

  • 纯CSS3制作卡通场景汽车动画效果

    前言今天分享一下我昨晚做的CSS3动画效果——卡通场景汽车动画。在接触CSS3动画之前,我之前实现一些简单的动画效...

  • 2018-11-27第九天总结

    一、 动画网页动画可以通过以下几种方式实现(gif、flash 除外),css3 动画SVG 动画JS 动画(包括...

  • 2019-01-02 css3过渡动画 css3圆角阴影透明度

    一、 动画网页动画可以通过以下几种方式实现(gif、flash 除外),css3 动画SVG 动画JS 动画(包括...

  • requestAnimationFrame

    动画 web开发中实现动画的方式有多种,CSS3中的transition和animation,js中的setInt...

  • 08_dayCSS动画

    CSS3新增的功能有:过渡和动画,阴影和圆角 css3过渡动画: css3都有哪些新增的东西 : 过度,动画,阴影...

  • css3动画

    css3动画 CSS3 可以创建动画,它可以取代许多网页动画图像、Flash 动画和 JavaScript 实现的...

网友评论

    本文标题:关于js动画和css3动画的差异性你了解吗?请简单谈一下

    本文链接:https://www.haomeiwen.com/subject/lncjwqtx.html