随机背景图案效果

代码语言:html

所属分类:背景

代码描述:通过正方形圆形五角星等效果实现背景布局效果

代码标签: 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
body {
  background: #333;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
</style>

</head>
<body translate="no">

<script>
function _defineProperty(obj, key, value) {if (key in obj) {Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true });} else {obj[key] = value;}return obj;} // CodePen Challenge
// Generative Patterns
//
// 1 Create a grid with random points
// 2 if those points are large enough check quad family
// 3 branch in up to 4 directions
// 4 do stuff and check again
// 
// Click to change



// Parent Render Class
class Render {
  constructor() {_defineProperty(this, "setViewport",















    element => {
      const canvasElement = element;
      const dc = document.documentElement;
      this.width = ~~(dc.clientWidth, window.innerWidth || 0);
      this.height = ~~(dc.clientHeight, window.innerHeight || 0);
      canvasElement.width = this.width;
      canvasElement.height = this.height;
    });_defineProperty(this, "createCanvas",

    name => {
      const canvasElement = document.createElement('canvas');
      canvasElement.id = name;
      this.setV.........完整代码请登录后点击上方下载按钮下载查看

网友评论0