pixi+gsap实现鼠标跟随电子噪点动画效果代码
代码语言:html
所属分类:动画
代码描述:pixi+gsap实现鼠标跟随电子噪点动画效果代码
代码标签: pixi gsap 鼠标 跟随 电子 噪点 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Anton'> <style> body { overflow: hidden; } .noise { position: absolute; width: 100%; height: 100%; background: #F5F7F8; } </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 = [0xF4CE14, 0x379777, 0x45474B]; 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 = Math.PI / 180 * gsap.utils.random(0, 360); const radius .........完整代码请登录后点击上方下载按钮下载查看
网友评论0