html 出现粒子线条，鼠标移动会以鼠标为中心吸附的特效之canvas-nest.js插件

我在网上看到一个很炫酷，很有趣的特效，网页上会有很多移动的粒子和线条，鼠标经过时会以鼠标为中心吸附过来，如果时间够久，会形成一个类似震动的、带辐条的车轮子的东西。

网上搜了一下，源码是github里面的canvas-nest.js插件

github地址：https://github.com/hustcc/canvas-nest.js

使用也很简单，html上引入插件js就行了，代码如下：

 

<script type="text/javascript" color="255,0,255" pointColor="255,0,255" opacity='0.7' zIndex="-2" count="100" src="dist/canvas-nest.js"></script>

　　

官方给的配置说明

Configuration

color: color of lines, default: '0,0,0'; RGB values: (R,G,B).(note: use ',' to separate.)
pointColor: color of points, default: '0,0,0'; RGB values: (R,G,B).(note: use ',' to separate.)
opacity: the opacity of line (0~1), default: 0.5.
count: the number of lines, default: 99.
zIndex: z-index property of the background, default: -1.

经我试验，大概是这样的：

color：线条颜色，默认是（0，0，0），格式是（R,G,B）
pointColor：粒子颜色，这个应该是线条连接的点的颜色，默认是（0，0，0），格式是（R,G,B）
opacity：透明度（0-1），默认0.5
count：线段的数量，默认0.5，设置的过多的时候页面打开会变慢，我设置10000，打开要好几秒，页面上的线条直接变成一坨了，也不会动了，O(∩_∩)O哈哈~
zIndex：Z-index参数，默认-1

done!