个人头像

柠檬酸

1月前来过

控制台
欢迎来到我的博客!
默认封面

00:00/

播放列表

超赞的网页蜂窝背景效果分享

发布于2017-01-16 / 975次浏览

今天逛别人的博客,又无意间看到一个不错的网页蜂窝背景效果。
于是自己很不要脸的偷了下来,给大家分享,可以让纯色的背景看上去不那么单调。效果可以参考本站。

特性:
不依赖于 jQuery 和 JavaScript 框架
轻量级,只有 1.66kb 大小
非常容易使用

使用:
1、下载canvas-nest.min.js脚本文件:点击下载

2、通过FTP等方法上传到自己网站上

3、在</body>标签之前引用该js文件即可。

小白法:

找到主题的footer.php,在</body>前加上这么一段js代码:

<script src="http://oijbbaxnm.bkt.clouddn.com/canvas-nest.min.js" type="text/javascript"></script>

注意:

开启ssl的站点是不支持http的引用的,所以还是老老实实本地引用:

把js文件放到根目录,然后:

<script src="canvas-nest.min.js" type="text/javascript"></script>

(绝对路径别搞错就行)

刷新就可以看到效果啦。开了cdn的小伙伴记得刷新下自己的cdn缓存

 

想换蜂窝颜色透明度或者数量,修改js文件里面的opacity、color和count数值即可。

 

喜欢 0
TAGS:  
本站文章除注明转载/出处外,均为本站原创或翻译。若要转载但请务必注明出处,尊重他人劳动成果。 转载请注明出处链接 : 超赞的网页蜂窝背景效果分享

3 条评论

  1. xiao酱沫 说道: 来自 Google Chrome 55.0.2883.95 in Mac OSX 10_12_2
    2017-01-24 23:20

    谢♂谢♂大♂佬♂

  2. keith 说道: 来自 Google Chrome 49.0.2623.75 in Windows 7
    2017-01-22 18:10

    哈哈 我也偷走了~~谢谢大神