gsap+ScrollTrigger实现滚动页面滚轮产品耳机渐显展示动画效果代码
代码语言:html
所属分类:加载滚动
代码描述:gsap+ScrollTrigger实现滚动页面滚轮产品耳机渐显展示动画效果代码,通过滚轮控制耳麦显示,其实就是一个图片序列。
代码标签: gsap ScrollTrigger 滚动 页面 滚轮 产品 耳机 渐显 展示 动画 效果 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> html { height: 100vh; } body { height: 5000px; background: #000; } canvas { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 100vw; max-height: 100vh; } </style> </head> <body> <canvas id="hero-lightpass"></canvas> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gsap.3.5.2.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ScrollTrigger-3.5.1.js"></script> <script> console.clear(); const canvas = document.getElementByI.........完整代码请登录后点击上方下载按钮下载查看
网友评论0