js实现canvas台风飓风粒子聚集动画效果代码
代码语言:html
所属分类:粒子
代码描述:js实现canvas台风飓风粒子聚集动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
body,
html {
width: 100%;
height: 100%;
overflow: hidden;
background-image: linear-gradient(135deg, #fdfcfb 0%, #e2d1c3 100%);
margin: 0;
font-family: Century Gothic, CenturyGothic, AppleGothic, sans-serif;
}
.f {
position: fixed;
bottom: 5px;
right: 15px;
font-family: 'Arial';
font-size: 0.7rem;
color: #32234a;
text-align: center;
}
.f a {
font-size: 0.8rem;
color: #d90368;
}
.slider {
width: 56% !important;
}
</style>
</head>
<body >
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/dat.gui-min.js"></script>
<script >
/**/ /* ---- CORE ---- */
/**/const canvas = document.createElement('canvas');
/**/const context = canvas.getContext('2d');
/**/let windowWidth = canvas.width = window.innerWidth;
/**/let windowHeight = canvas.height = window.innerHeight;
/**/let origin = { x: windowWidth * 0.5, y: windowHeight * 0.5 };
/**/context.translate(origin.x, origin.y);
/**/canvas.id = 'canvas';
/**/document.body.insertBefore(canvas, document.body.firstChild);
/**/window.onresi.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0