特效描述:html5 canvas 粒子动画生成 图片特效。html5基于canvas粒子化图片 利用easying.js公式计算粒子动态轨迹方程, x轴方向和y轴方向的公式均可以选择 可以设置粒子运动时间档等自定义功能,通过粒子动画生成指定图片效果代码。(ps:本地预览请用火狐浏览器,chrome需要在服务端运行)
代码结构
1. 引入CSS
2. 引入JS
3. HTML代码
点击任意位置运行 时间:
5
6
7
8
9
10
图片:
商标
心跳
IMAX
logo
a5
X:
easeInQuad
easeOutQuad
easeInOutQuad
easeInCubic
easeOutCubic
easeInOutCubic
easeInQuart
easeOutQuart
easeInOutQuart
easeInQuint
easeOutQuint
easeInOutQuint
easeInSine
easeOutSine
easeInOutSine
easeInExpo
easeOutExpo
easeInOutExpo
easeInCirc
easeOutCirc
easeInOutCirc
easeInElastic
easeOutElastic
easeInOutElastic
easeInBack
easeOutBack
easeInOutBack
easeInBounce
easeOutBounce
easeInOutBounce
Y:
easeInQuad
easeOutQuad
easeInOutQuad
easeInCubic
easeOutCubic
easeInOutCubic
easeInQuart
easeOutQuart
easeInOutQuart
easeInQuint
easeOutQuint
easeInOutQuint
easeInSine
easeOutSine
easeInOutSine
easeInExpo
easeOutExpo
easeInOutExpo
easeInCirc
easeOutCirc
easeInOutCirc
easeInElastic
easeOutElastic
easeInOutElastic
easeInBack
easeOutBack
easeInOutBack
easeInBounce
easeOutBounce
easeInOutBounce