超酷炫的js背景插件canvas-nest.js安利一发——超酷炫的js背景插件canvas-nest.js

192 阅读 0 评论 127 点赞

我是靠谱客的博主香蕉花生，这篇文章主要介绍超酷炫的js背景插件canvas-nest.js安利一发——超酷炫的js背景插件canvas-nest.js，现在分享给大家，希望可以做个参考。

安利一发——超酷炫的js背景插件canvas-nest.js

之前在某不知名网站上看到过，觉得好酷炫，当时也没多想怎么写的。

今天正好手头上没有事情在一个技术网站上，又在某技术网站上看到了这个背景，实在是忍不住好奇心，想知道怎么实现的，遂在各个技术群问了一句，没想到真的有人知道。

demo地址: http://www.luoyuhu.com/

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

官方tip：使用方法很简单只需要再body中间插入这段js代码即可，注意不要放在head里面

复制代码

<html>
<head>
    ...
</head>
<body>
    ...
    ...
    ...
    <script src="//cdn.bootcss.com/canvas-nest.js/1.0.1/canvas-nest.min.js"></script>
</body>
</html>

复制代码

配置：颜色：默认是（0，0，0），格式是（R,G,B）

　　　透明度：（0-1），默认0.5

　　　线段的数量：默认0.5

　　 Z轴：默认-1

使用方法：

<script type="text/javascript" color="0,0,255" opacity='0.7' zIndex="-2" count="99" src="//cdn.bootcss.com/canvas-nest.js/1.0.1/canvas-nest.min.js"></script>