canvas教程

HTML5超逼真下雪场景效果

字号+ 作者:H5之家 来源:H5之家 2016-12-30 10:00 我要评论( )

这是一款基于jquery的超逼真下雪场景特效。该特效使用jquery代码来动态插件html5 canvas元素,然后在canvas中制作下雪特效。 使用方法 在页面中引入ThreeCanvas.js、jquery和Snow.js和snowFall.js文件。 script src="path/to/ThreeCanvas.js"/script script

这是一款基于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 }); 配置参数

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 基于HTML5 canvas的仪表盘插件

    基于HTML5 canvas的仪表盘插件

    2016-10-12 13:00

  • 支持移动手机的canvas刮刮卡插件

    支持移动手机的canvas刮刮卡插件

    2016-10-12 12:00

  • 中国最大的HTML5学习平台

    中国最大的HTML5学习平台

    2016-09-26 16:00

  • 基于HTML5 canvas的简单抽奖转盘

    基于HTML5 canvas的简单抽奖转盘

    2016-06-06 14:00

网友点评