常用的CSS动画库

常用的CSS动画库_第1张图片
1.Animista
网站地址:http://animista.net/
网站描述:在线生成 css 动画
2.Animate CSS
网站地址:http://daneden.github.io/anim...
网站描述:齐全的CSS3动画库
3.Angrytools
网站地址: https://angrytools.com/css/an...
4.Hover.css
网站地址: http://ianlunn.github.io/Hover/
网站描述: 纯CSS3鼠标滑过效果动画库
Hover.css是许多CSS动画的集合,与上面的动画不同,每次将元素悬停时都会触发。
一组CSS3支持的悬停效果,可应用于链接、按钮、徽标、SVG和特色图像等。
** 用法
它非常简单:只需将类的名称添加到元素中,比如

5.WickedCSS
网站地址: http://kristofferandreasen.gi...
WickedCSS是一个小的CSS动画库,它没有太多的动画变体,但至少有很大的变化。 其中大多数是我们已经熟悉的基础知识,但它们确实很干净。
它的用法很简单,只需将动画的名称添加到元素中即可。

** 使用 JS

document.querySelector('.my-element').classList.add('bounceIn')

** 使用 JQ
$(".my-element").addClass("bounceIn")
豌豆资源搜索网站https://55wd.com
6.Three Dots
网站地址: https://nzbin.github.io/three
Three Dots是一组CSS加载动画,它由三个点组成,而这些点仅由单个元素组成。
** 用法
只需创建一个div元素,并添加动画的名称


7.TweenMax.js
网站地址:https://www.tweenmax.com.cn/i...
8.Velocity.js
网站地址:http://shouce.jb51.net/veloci...

你可能感兴趣的:(css3)