svg实现动态红色立体菱形背景效果代码

代码语言:html

所属分类:背景

代码描述:svg实现动态红色立体菱形背景效果代码

代码标签: 红色 立体 菱形 背景 效果

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

<html>
<head>
<meta charset="utf-8">
<style type="text/css">
html {
	background: radial-gradient(ellipse at center, #ef0e39 0%, black 100%);
	overflow: hidden;
}
</style>
</head>

<body>

<div id="bg"></div>

<script type="text/javascript">
var refreshDuration = 10000;
var refreshTimeout;
var numPointsX;
var numPointsY;
var unitWidth;
var unitHeight;
var points;

function onLoad()
{
    var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
    svg.setAttribute('width',window.innerWidth);
    svg.setAttribute('height',window.innerHeight);
    document.querySelector('#bg').appendChild(svg);

    var unitSize = (window.innerWidth+window.innerHeight)/20;
    numPointsX = Math.ceil(window.innerWidth/unitSize)+1;
    numPointsY = Math.ceil(window.innerHeight/unitSize)+1;
    unitWidth = Math.ceil(wi.........完整代码请登录后点击上方下载按钮下载查看

网友评论0