Web API 之 — Web Animations

现代的前端,在页面上做动画,已经是家常便饭。浏览器的渲染性能也越来越好,并且还逐渐提供了一系列的 Web Animations API。此 API 让开发者可以使用 js 来创建动画,相比之前使用 css 做动画会方便很多,同时相比以前传统的用 js 做的动画会更加高效,并且相信未来此 API 的能力会越来越大。

Web Animations 可查看 w3c 的规范文档。在 caniuse 上,可查看浏览器的支持情况,如下:
在这里插入图片描述

可看到,目前主流浏览器均已支持此 API 的基本功能。下面我们就来学习一下此 API 的基本用法。

创建动画

创建动画,使用 animate()方法。语法如下:

var animation = element.animate(keyframes, options);

该方法接收两个参数。

第一个参数是 keyframes,keyframes 可以是一个 keyframe 对象组成的数组,也可以是一个 css 属性组成的对象,每个属性对应的值是 cs


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部