html5+JavaScript动画节点和连接线背景特效

演示  website 下载

插件介绍

使用纯JavaScript和HTML5画布API构建，可以创建一个以动画节点和连接线为背景的粒子系统。

使用方法

1.在html页面加载插件文件。

<script src="js/nodes.js"></script>

2.创建一个HTML画布元素来放置粒子系统。

<canvas id="nodes"></canvas>

3.创建新的NodesJs对象以在画布上生成默认粒子系统。

var nodesjs = new NodesJs({
    // options here
});

4.使用以下参数自定义粒子系统。

var nodesjs = new NodesJs({

    // container ID
    id: 'nodes',

    // width
    width: window.innerWidth,

    // height
    height: window.innerHeight,

    // background transition options
    backgroundFrom: [10, 25, 100],
    backgroundTo: [25, 50, 150],
    backgroundDuration: 4000,

    // the number of particles
    number: window.hasOwnProperty('orientation') ? 30: 100,

    // animation speed
    speed: 20
    
});