今天看到一个站点首页,背景很酷炫,鼠标移动,线条聚集,现代科技感十足,很适合技术站点使用,于是百度了一下,找找相关的库,有的是纯css3写的粒子特效(我勒个去),还有的是用JS去写的canvas画图实现。
这个帖子就是分享一个JS酷炫背景插件。
DEMO在JFinal学院的静态HTML首页上,我加了。
(抱歉,暂时是个很简陋的静态页,正在整合资源,开发中。。。)
预览效果DEMO地址:http://www.jfinalxueyuan.com
插件地址:https://github.com/hustcc/canvas-nest.js
使用方法:
在<body>标签结尾处加入一行JS引入就可以了:
<script color="255,255,255" opacity='0.5' zIndex="-1" count="100" src="assets/js/canvas-nest.js" type="text/javascript"></script>
其中color是颜色值,opacity是透明度,zIndex是现在层级,count是线条数量。
请关注JFinal学院的微信公众号(jfinalxueyuan) 上图也有二维码 可以扫码关注;
回复分享课 获得更多分享课JFinal视频教程
本图文课程对应视频教程-网盘地址:
链接: https://pan.baidu.com/s/1mX4qU01ckJfbhzPvoM_i9A
提取码: h7yn
项目:JBolt极速开发平台