jParticle是一款可以用鼠标进行互动的粒子动画特效jQuery插件。该粒子动画特效是在canvas中使用requestAnimationFrame来制作。插件中提供大量参数用于设置粒子的大小，颜色，速度和连线等等属性。
使用方法
使用这个粒子动画效果需要引入jQuery和jparticle.jquery.min.js文件。
<script src = "Path/To/jQuery" type = "text/javascript"></script>
<script src = "Path/To/jparticle.jquery.min.js" type = "text/javascript"></script>
初始化插件
然后就可以在你需要制作粒子效果的容器中调用该插件。
$("#jparticle-container").jParticle();
// with options
$("#jparticle-container").jParticle({
// options
});
配置参数
这个粒子特效插件的可用参数如下：
| 参数 | 描述 | 默认值 |
| particlesNumber | 粒子的数量 | 100 |
| linkDist | 连线完全透明的距离 | 50 |
| createLinkDist | 粒子开始连线的距离 | 150 |
| linksWidth | 连线的宽度 | 1 |
| disableLinks | 如果这个参数设置为true，则禁止在粒子之间连线 |
false |
| disableMouse | 如果这个参数设置为true，则粒子之间的连线和鼠标互动都被禁止 |
false |
| background | 背景颜色 | "black" |
| color | 粒子和连线的颜色 | "white" |
| width | 粒子容器的宽度 | null（使用父容器的宽度） |
| height | 粒子容器的高度 | null（使用父容器的高度） |
| particle.color | 粒子的最小尺寸，单位像素 | 2 |
| particle.maxSize | 粒子的最大尺寸，单位像素 | 4 |
| particle.speed | 粒子的动画速度，单位：像素/帧 x 60 | 60（1像素/帧） |
$("#jparticle-container").jParticle({
particlesNumber: 100,
linkDist: 50,
createLinkDist: 150,
disableLinks: false,
disableMouse: false,
background: "black",
color: "white",
width: null,
height: null,
linksWidth: 1,
particle: {
color: "white",
minSize: 2,
maxSize: 4,
speed: 60
}
});
方法
移除jParticle粒子动画
$("#jparticle-container").removeJParticle();
冻结jParticle粒子动画
$("#jparticle-container").freezeJParticle();
解冻jParticle粒子动画
$("#jparticle-container").unfreezeJParticle();
