【web素材】05—13款炫酷的HTML5实例动画
素材整理 | 杨小二
前言
在之前的文章中，我也跟大家分享过关于CSS3以及HTML5制作的一些动画效果，虽然这些动画效果，可能在实际项目中根本不会应用到，但是，我们通过这些练习，可以帮助我们更好的理解与掌握CSS3与HTML5的相关知识。
因此，在这一期的《web素材》中，我为大家准备了13款HTML5实现的动画实例，大家可以根据自己的需要，自行下载练习。
01、酷炫的天体木星动画特效
因为这个动画文件实在太大了，所有就截图了，如果你有兴趣的话，可以下载，自行浏览学习，这个是html5基于three绘制宇宙银河系行星天体围绕旋转动画，木星旋转动画特效，也支持全屏预览。
下载地址：https://089u.com/f/21793581-502643588-a78bf9
（密码：2698）
02、发光的线条爱心形状动画特效
html5基于webgl制作酷炫发光的线条爱心轮廓形状动画，线条绘制爱心动画特效。
下载地址：https://089u.com/f/21793581-502643590-0a5efc
（密码：2698）
03、创意的贪吃蛇svg动画特效
这个是基于canvas绘制卡通可爱的贪吃蛇来回游走动画，矢量的贪吃蛇网页动画特效，鼠标或手指移动控制贪吃蛇速度，可在手机端展示。
下载地址：https://089u.com/f/21793581-502643592-b11436
（密码：2698）
04、彩色的宇宙星云canvas动画特效
H5基于canvas制作全屏的彩色圆点粒子旋转，银河系星云粒子动画特效。
下载地址：https://089u.com/f/21793581-502643594-982922
（密码：2698）
05、菱形图案彩色圆球动画特效
H5基于canvas绘制多种颜色的菱形图案组成的圆球变色动画。支持单击网页暂停或开始动画特效。
下载地址：https://089u.com/f/21793581-502643596-981e76
（密码：2698）
06、全屏透明的雪花片状掉落动画特效
gsap基于svg制作全屏透明的下雪雪花飘落，白色的雪花片状一片片掉落背景动画特效，点击网页可停止或开始。
下载地址：https://089u.com/f/21793581-502643598-272faa
（密码：2698）
07、酷炫的三角形图案动画特效
基于canvas制作三角形花纹旋转变形图案动画，三角形结构背景动画特效。
下载地址：https://089u.com/f/21793581-502643600-ec5e1a
（密码：2698）
08、蓝色线条六角形动画特效
基于canvas绘制蓝色酷炫的六角形旋转变形动画，线条结构的六角形图形动画特效。
下载地址：https://089u.com/f/21793581-502643602-66673e
（密码：2698）
09、云雾状文字3D动画切换特效
基于canvas绘制白色云雾状的粒子文字3d动画自动切换，支持自定义各种字符文字动画切换特效。
下载地址：https://089u.com/f/21793581-502643604-2bea4c
（密码：2698）
10、游走的鱼群canvas动画
这是一个基于jquery插件鱼群canvas动画，它使用create.js库将html5画布元素转换为可配置参数游泳速度，减速，弧度，转动频率，鱼的数量，鱼大小，游泳周期，颜色等交互式的鱼群动画。
下载地址：https://089u.com/f/21793581-502643606-046f39
（密码：2698）
11、canvas画布千纸鹤动画特效
基于canvas 2D画布绘制飞行的千纸鹤背景动画特效。
下载地址：https://089u.com/f/21793581-502643608-13b551
（密码：2698）
12、html5 svg爱心圆圈动画特效
基于svg绘制彩色的爱心圆圈慢慢变大循环动画背景特效。
下载地址：https://089u.com/f/21793581-502643610-2d4928
（密码：2698）
13、canvas绘制几何图形密集动画特效
canvas彩色密集的几何图形放大缩小动画特效。单击可更改。
下载地址：https://089u.com/f/21793581-502643612-f059a8
（密码：2698）
总结
到这里，这期分享的13款动画实例，就全部分享完毕了。
学习更多技能
请点击下方公众号
