gsap+pixi实现鼠标跟随粒子泡泡动画效果代码
代码语言:html
所属分类:粒子
代码描述:gsap+pixi实现鼠标跟随粒子泡泡动画效果代码
代码标签: gsap pixi 鼠标 跟随 粒子 泡泡 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/normalize.css"> <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Anton'> <style> body { overflow: hidden; } .noise { position: absolute; width: 100%; height: 100%; background: #050C9C; } </style> </head> <body translate="no"> <div class="noise"></div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/pixi.8.2.5.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gsap.3.12.2.js"></script> <script > const initNoise = async () => { const noiseColors = [0x3572EF, 0x3ABEF9, 0xA7E6FF]; const app = new PIXI.Application(); const wrapper = document.querySelector('.noise'); await app.init({ resizeTo: window, antialias: true, backgroundAlpha: 0 }); wrapper.appendChild(app.canvas); const addNoise = (x, y) => { const graphics = new PIXI.Graphics(); const size = gsap.utils.random(5, 15); const radian =.........完整代码请登录后点击上方下载按钮下载查看
网友评论0