jquery实现canvas粒子磁场流变形动画效果代码
代码语言:html
所属分类:粒子
代码描述:jquery实现canvas粒子磁场流变形动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script>
<style>
html,body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
.container{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
background-color: #000000;
}</style>
</head>
<body>
<div id="jsi-particle-container" class="container"></div>
<script>
var RENDERER = {
PARTICLE_COUNT : 1000,
PARTICLE_RADIUS : 1,
MAX_ROTATION_ANGLE : Math.PI / 60,
TRANSLATION_COUNT : 500,
init : function(strategy){
this.setParameters(strategy);
this.createParticles();
this.setupFigure();
this.reconstructMethod();
this.bindEvent();
this.drawFigure();
},
setParameters : function(strategy){
this.$window = $(window);
this.$container = $('#jsi-particle-container');
this.width = this.$container.width();
this.height = this.$container.height();
this.$canvas = $('<canvas />').attr({width : this.width, height : this.height}).appendTo(this.$container);
this.context = this.$canvas.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0