HTML5 Canvas绘制银河系特效(鼠标点击拖动一下看效果)
代码语言:html
所属分类:粒子
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 Canvas绘制银河系特效</title>
<style>
body {
margin:0;
}
canvas {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
</style>
</head>
<body>
<script type="text/javascript">
var w = window.innerWidth;
var h = window.innerHeight;
var dustCanvas = document.createElement('canvas');
var dustCtx = dustCanvas.getContext('2d');
var starCanvas = document.createElement('canvas');
var starCtx = starCanvas.getContext('2d');
document.body.appendChild(dustCanvas);
document.body.appendChild(starCanvas);
dustCanvas.width = starCanvas.width = w;
dustCanvas.height = starCanvas.height = h;
dustCtx.globalCompositeOperation = 'lighter';
starCtx.globalCompositeOperation = 'lighter';
var galaxies = [];
var mouse = {
pos: {
x: w * 0.5,
y: h * 0.5
},
speed: 0
};
var randomNumbers = length => Array.from(new Array(length), () => Math.random());
var PI = Math.PI;
var TAU = PI * 2;
var r = () => Math.random();
var an.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0