多彩球体旋转三维动画效果

代码语言:html

所属分类:粒子

代码描述:多彩球体旋转三维动画效果

代码标签: 三维动画 效果

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


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

<style>
* {
margin: 0 auto;
padding: 0;
}

html, body {
width: 100%;
height: 100%;
}

html {
display: table;
border-spacing: 0;
}

body {
display: table-cell;
vertical-align: middle;
text-align: center;
background: transparent;
}

canvas{
transform:rotate(45deg);
border-radius:50%;
box-shadow:20px 2px  40px #111;
}

.bg {
background: radial-gradient(circle, #000 40%, DeepPink  100%);
}

div {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
}
</style>

</head>
<body translate="no">
<div class="bg"></div>

<script>
var C = document.createElement('canvas');
var c = C.getContext('2d');

C.width = 200;C.height = 200;
document.body.appendChild(C);

var particles = [];
for (var i = 3000; i--; particles.push([
Math.ran.........完整代码请登录后点击上方下载按钮下载查看

网友评论0