canvas啤酒冒泡泡粒子动画效果代码
代码语言:html
所属分类:粒子
代码描述:canvas啤酒冒泡泡粒子动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
body {
margin: 0;
padding: 0;
background: radial-gradient(ellipse at top, #2b250a 0%, #000000 100%);
overflow: hidden;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
img {
width: 350px;
height: 350px;
position: absolute;
border-radius: 100%;
z-index: -2;
}
@media only screen and (min-width: 1024px) {
img {
width: 568px;
height: 568px;
}
}
</style>
</head>
<body >
<img src="//repo.bfw.wiki/bfwrepo/image/64c851d688fb7.png" alt="">
<canvas id="canvas">
</canvas>
<script >
console.clear();
let canvas = document.getElementById("canvas");
let ctx = canvas.getContext("2d");
let particlesArr = [];
let numberOfParticles = 3;
let radius;
if (window.innerWidth > 1024) {
canvas.width = 800;
canvas.height = 1000;
ra.........完整代码请登录后点击上方下载按钮下载查看
网友评论0