码迷,mamicode.com
首页 > Web开发 > 详细

js 动态生成背景图 GeoPattern

时间:2017-09-19 17:49:05      阅读:1042      评论:0      收藏:0      [点我收藏+]

标签:网络发现   参考资料   style   2.2.3   image   geo   cti   样式   var   

以前有个想法,能不能用JS动态创建CANVAS绘制图案当网页背景,在网络发现有现成的别人已经实现的:GeoPattern

代码如下:

<!DOCTYPE html>  
<html>  
<head>  
<title>js 生成随机背景图</title>  
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/geopattern/1.2.3/js/geopattern.min.js"></script>
<style>
html, body{
margin:0; padding:0; width:100%; height:100%;
}
</style>
</head>  
<body>
<script>
$(function(){
    var option = {
        //color:‘#060‘,     // 前景色
        //baseColor:‘#006‘, // 背景色
        //generator:‘plusSigns‘, // 样式
    };
    var pattern = GeoPattern.generate(GitHub + Math.random(), option);
    $(body).css(background-image, pattern.toDataUrl());
});
</script>
</body>  
</html>  

 

参考资料:

https://github.com/btmills/geopattern

http://btmills.github.io/geopattern/

js 动态生成背景图 GeoPattern

标签:网络发现   参考资料   style   2.2.3   image   geo   cti   样式   var   

原文地址:http://www.cnblogs.com/zjfree/p/7552583.html

(1)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!