three+vfx实现网页滚动文字炫酷过渡动画效果代码
代码语言:html
所属分类:加载滚动
代码描述:three+vfx实现网页滚动文字炫酷过渡动画效果代码
代码标签: three vfx 网页 滚动 文字 炫酷 过渡 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> html, body { margin: 0; background: black; } section { height: 100svh; display: grid; place-content: center; } h2 { font-size: 20vw; color: white; } img { position: absolute; width: 100%; height: 300svh; object-fit: cover; opacity: 0.15; } </style> </head> <body translate="no"> <img src="//repo.bfw.wiki/bfwrepo/image/5d6539c1971b8.png"/> <section> <h2>Shift</h2> </section> <section> <h2>Your</h2> </section> <section> <h2>Mind.</h2> </section> <script type="module"> import { VFX } from "//repo.bfw.wiki/bfwrepo/js/module/vfx-core.mjs"; const vfx = new VFX(); const lerp = (a, b, t) => a * (1 - t) + b * t; const shaderH = ` precision highp float; uniform vec2 resolution; uniform vec2 offset; uniform float .........完整代码请登录后点击上方下载按钮下载查看
网友评论0