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