1、首先要下载一个canvas-nest.js文件,这个下载,大家百度一下就可以下载到。这介绍使用,其中的具体原理就不再这讲述了。
2、建立一个html文件,文件引入这个js文件即可,但是引入的位置需要注意。不能放到<head>标签中,应该放到<body>标签中。
3、使用浏览器打开这个html文件查看效果是否出来了。
4、这个动态背景,是许多粒子在无规则的运动着,其中如果两个粒子的距离较近的时候,两个粒子中间就会产生一个线段。如图所示:
5、当你的鼠标在页面上停留在页面上的某个位置不动的时候,这些粒子在靠近鼠标的时候,会被吸引住,不再离开,并且最终会形成一个圆形动态图案。当你鼠标再次移动的时候,圆形图案随即解体。
6、粒子间线条颜色的设置,在引入的标签中的罕铞泱殳color指定。<script type="text/javascript" color="255,0,0" zindex="-1" opacity="1" count="99" src="canvas-nest.min.js"></script>