分享一款用于网页背景粒子系统的JavaScript插件，支持而且还能和鼠标指针互动的视差效果，适用于任何支持html5画布的浏览器。

github地址：https://github.com/jnicol/particleground
演示dom：https://jnicol.github.io/particleground/

使用文法

引入文件：

<script src="https://jnicol.github.io/particleground/js/jquery.particleground.js"></script>

html：

<div id="particles"></div>

js：

particleground(document.body, {
 dotColor: '#eee',
 lineColor: '#ddd'
});

注意事项：v1.0.0以上版本支持js原生调用，不必依赖jquery。

参数

ps:需要注意的是density这个显示粒子数量的参数，官方默认值是1e4也就是10的4次方10000，设定数值简易设定为10000左右的数值不要太大也不要太小。

数值越大显示的粒子数量越小

数值越小显示的粒子数量越多

如果设定成100或50浏览器基本上就打不开这个页面了直接崩溃卡死

本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！

链接: https://fly63.com/article/detial/12290