Github轻量级开源动画引擎——Animejs

JavaScript017

Github轻量级开源动画引擎——Animejs,第1张

Anime.js是一个轻量级的JavaScript动画库,具有简单但功能强大的API。它与CSS属性,SVG,DOM属性和JavaScript对象一起使用。

Github

在Github上已收获近35k的star数,可见其非常受广大使用者的热爱!

特性

复杂的交错动画变得简单

css分层转换

在单个HTML元素上同时以不同的时间对多个CSS变换属性进行动画处理。

控件和回调

时间就是一切

使用完整的内置回调和控件功能同步播放,暂停,控制,倒退和触发事件。

动画任何东西

HTML,JS,CSS,SVG

安装使用

ES6:

CommonJS:

Demo

文字动画

块状动画

徽标动画

球状动画

总结

anime是一个非常值得使用的动画引擎,它足够简单,足够满足需求,足够的轻量,足够的惊艳!

你应该首先说说你要做东西的复杂度,不然大家都建议你用原生代码搞定,你是无法得到你想要答案的。

我来给你点建议把。

能自己手写CSS3就写CSS3, 不行就使用CSS3库 Animate.css (封装一层的东西会差一些),如果要兼容低端安卓,就可能用JS,就使用velocity.js与jQuery.animate, 另,这个动画库也不错 daniel-lundin/snabbt.js · GitHub

方法调用该粒子插件:

particlesJS('particles-js', {

particles: {

color: '#fff',

shape: 'circle',

opacity: 1,

size: 4,

size_random: true,

nb: 150,

line_linked: {

enable_auto: true,

distance: 100,

color: '#fff',

opacity: 1,

width: 1,

condensed_mode: {

enable: false,

rotateX: 600,