jQuery粒子系统插件Particleground

dreamweaver免费视频教程：

51RGB Dreamweaver板块

加讨论群390180913 入群即可参加周一至周五免费公开课并获得免费视频 绝对干货！

 

jQuery粒子系统插件Particleground

 

使用方法

页面调用jquery和particleground.js

<script type='text/javascript' src='js/jquery-1.11.1.min.js'></script>

<script type='text/javascript' src='jquery.particleground.min.js'></script>

Html

<div id="particles">

  <div class="intro">

    <h1>Particleground</h1>

    <p>A jQuery plugin for snazzy background particle systems</p>

  </div>

</div>

js初始化插件，调用对应的id

$('#particles').particleground();

选项

可以通过设置选项选择对象的构造函数。

下面是一个示例的设置粒子系统点和线的颜色:

$('#your-element').particleground({

    dotColor: '#ff0000',

    lineColor: '#ff0000'

});

下面是一个完整的列表的选项,默认值:

minSpeedX

 

0.1

maxSpeedX

 

0.7

minSpeedY

 

0.1

maxSpeedY

 

0.7

directionX

 

'center'

 

可以“center”,“left”或'right”。“中心”意味着点将反弹的边缘画布。

 

directionY

 

'center'

可以 'center', 'up' or 'down'. 'center' 意味着点将反弹的边缘画布。

 

代码压缩包链接：

http://www.51rgb.com/nbbs/forum.php?mod=viewthread&tid=1710

光看文字怎么够 来看在线视频 手把手教你做网站！

Adobe官方讲师万晨曦指导 轻松幽默学习网站开发

Dreamweaver视频直达网址 ：51RGB Dreamweaver板块