canvas+webgl实现草莓粒子跟随鼠标动画效果代码
代码语言:html
所属分类:粒子
代码描述:canvas+webgl实现草莓粒子跟随鼠标动画效果代码
代码标签: canvas webgl 草莓 粒子 跟随 鼠标 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel='stylesheet' href='https://fonts.googleapis.com/css2?family=Montserrat:wght@900&display=swap'> <style> body { margin: 0; width: 100%; height: 100%; cursor: pointer; background: url("//repo.bfw.wiki/bfwrepo/image/6435154a8272d.png") no-repeat center center; background-size: cover; } body.hide-background { background: none; } canvas { display: block; } </style> </head> <body> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ogl.umd.js"></script> <script> function App() { const { Renderer, Geometry, Program, Mesh, Vec2, Vec3, Texture, GPGPU } = ogl; let renderer, gl; let time, mouse, ratio; let points, positionB, dataB; let texture; init(); function init() { renderer = new Renderer({ dpr: 2, alpha: true, depth: false, autoClear: true, preserveDrawingBuffer: false }); gl = renderer.gl; document.body.appe.........完整代码请登录后点击上方下载按钮下载查看
网友评论0