原生js实现一个canvas多彩粒子烟花随鼠标喷射动画效果代码
代码语言:html
所属分类:粒子
代码描述:原生js实现一个canvas多彩粒子烟花随鼠标喷射动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> canvas { left: 50%; margin: -200px 0 0 -200px; position: absolute; top: 50%; } </style> </head> <body> <canvas id="c"></canvas> <script> var b = document.body; var c = document.getElementsByTagName('canvas')[0]; var a = c.getContext('2d'); h = 400; p = []; j = 0; k = 0; u = 0; m = Math; q = function(e, b) { return ~~(m.random() * (b - e + 1) + e); }; d = "Infinity"; c.width = 400; c.height = h; document.bgColor = "#111"; c.style.background = "#000"; c.addEventListener("mousemove", function(e) { j = m.floor(e.pageX - c.offsetLeft - 200); k = m.floor(e.pageY - c.offsetTop - h / 2); e = -(-k / -j); u = m.floor(m.atan(e) * (180 / m.PI)); 0 > j && 0 > k && (u += 180); 0 > j && 0 < k && (u += 180); 0 < j && 0 < k && (u += 360); 0 > k && e == "-" + d && (u = 90); 0 < k .........完整代码请登录后点击上方下载按钮下载查看
网友评论0