gsap实现拖动老式留声机碟片音乐播放快进效果代码
代码语言:html
所属分类:多媒体
代码描述:gsap实现拖动老式留声机碟片音乐播放快进效果代码
代码标签: gsap 拖动 老式 留声机 碟片 音乐 播放 快进
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> html, body { margin: 0; height: 100%; overflow: hidden; } canvas { max-width: 100%; } </style> </head> <body> <canvas id="myCanvas"></canvas> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/dat.gui-min.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gsap.3.10.1.js"></script> <script > // Images Data const images = [ "//repo.bfw.wiki/bfwrepo/image/62e1fd6ee09cc.png", ]; imgRandomNum=0; // const imgRandomNum = Math.floor(Math.random() * 4); //console.log(imgRandomNum); // Environment Variables let updateFPS = 30; let showMouse = true; let count = 0; let bgColor = "#ddd"; // Controls const controls = { speed: 0, fadeRate: 0.99, play_05x: () => { cd.angleSpeed = 0.5; controls.fadeRate = 1; }, play_1x: () => { cd.angleSpeed = 1; controls.fadeRate = 1; }, play_2x: () => { cd.angleSpeed = 2; controls.fadeRate = 1; } }; const gui = new dat.GUI(); gui. add(controls, "speed", 0, 4). step(0.01). onChange(function (value) { if (cd) cd.angleSpeed = value; }). listen(); gui. add(controls, "fadeRate", 0.8, 1). step(0.001.........完整代码请登录后点击上方下载按钮下载查看
网友评论0