简要教程
这是一款基于jquery的超逼真下雪场景特效。该特效使用jquery代码来动态插件html5 canvas元素,然后在canvas中制作下雪特效。
使用方法
在页面中引入threecanvas.js、jquery和snow.js和snowfall.js文件。
<script src="path/to/threecanvas.js"></script>
<script src="path/to/jquery.min.js"></script>
<script src="path/to/snow.js"></script>
<script src="path/to/snowfall.js"></script>
初始化插件
在页面dom元素加载完毕之后,可以通过下面的方法来初始化该下雪特效。
$.snowfall({
//创建粒子数量,密度
particleno: 500,
//粒子下落速度
particlespeed:30,
//粒子在垂直(y轴)方向运动范围
particley_range:1300,
//粒子在垂直(x轴)方向运动范围
particlex_range:1000,
//是否绑定鼠标事件
bindmouse: false,
//相机离z轴原点距离
zindex:600,
//摄像机视野角度
angle:55,
wind_weight:0
});
配置参数
particleno:创建粒子数量,密度。
particlespeed:粒子下落的速度。
particley_range:粒子在垂直(y轴)方向运动范围。
particlex_range:粒子在垂直(x轴)方向运动范围。
bindmouse:是否绑定鼠标事件。
zindex:相机离z轴原点距离。
angle:角度。
wind_weight:风的等级。
以上就是html5超逼真下雪场景效果的内容。