
波浪线
超轻量级Canvas波浪动画(仅2KB,纯JS实现)这是一款极简的波浪动画效果,基于纯JavaScript和Canvas技术实现,代码精简至2KB,不依赖任何第三方库。它的特点是高性能、低资源占用,适合嵌入网页背景、数据可视化或微交互场景,能为静...

燃烧弹出框
WebGL 实现弹窗以火焰燃烧特效消失效果 - 让DOM元素动态燃起来这是一款主要基于WebGL+GSAP+three.js技术实现的动态火焰燃烧特效,可让弹窗(Pop-Up)、按钮或其他DOM元素在点击交互时呈现逼真的燃烧动画消失效果。火焰可随交互实时变化,支持...

脚丫光标
GSAP SVG小脚丫脚步光标跟随特效源码下载这是一款优雅的鼠标光标路径跟随效果,通过SVG路径动画与GSAP平滑缓动技术实现,让小脚丫像跳芭蕾般精准踩踏用户光标移动轨迹,适用于高端产品展示页、创意机构官网等需要提升光标交互仪式感的场景。

步行者
GSAP滚动驱动步行动画,适用于作品集个性展示或互动叙事网站等需要表现人物动态的场景这是一款基于滚动触发的步行动画效果,采用GSAP ScrollTrigger技术驱动逐帧动画,将传统影视 walk cycle 原理移植到网页滚动交互中,适用于作品集个性展示、角色介绍页面或互动...

触屏生花
WebGL实现点击屏幕随机长出一株漂亮小花效果古有“妙笔生花”,今有“触屏生花”,这是一款创意绘画交互效果,基于WebGL结合Three.js技术实现,通过点击触发花朵粒子生成,将用户操作转化为即时绽放的彩色花丛,适用于艺术创作平台、儿童教...

3D地图定位
Three.js支持点击定位的 3D 旋转地球仪(动态坐标标记方案)这是一款带坐标定位的3D转动地球仪动画效果,基于Three.js技术实现,通过三维球体与动态标记点的结合,适用于企业全球业务展示、旅行轨迹可视化或实时数据监控等需要突出地理位置的交互场景。

旋转地球仪
Three.js SVG交互式三维旋转地球仪(矢量地图WebGL渲染方案)这是一款交互式三维转动地球仪,基于Three.js+SVG+GSAP技术实现,通过将平面矢量地图动态投影到WebGL球体表面,清晰的展示国家与地区的分布,并且支持鼠标悬停展示名称,同时还支持通过...

燃烧扩散
滚动触发的WebGL火烧纸张火焰逐渐扩散过渡效果(GSAP联动方案)这是一款视差火焰撕裂纸张过渡效果,基于WebGL+GSAP ScrollTrigger技术实现,通过动态燃烧的粒子动画与滚动深度精准绑定,适用于叙事型网页、产品发布会等需要戏剧性场景转换的高冲击...

丝滑动态背景
2KB超轻量级SVG五色流动丝滑动态背景(纯矢量动画方案)这是一款极简SVG五种颜色流动动画背景效果,基于纯SVG技术实现,仅2KB超轻量级,通过细腻的路径动画创造出无限循环流动的抽象动态图形,适用于登陆页背景、仪表盘界面等需要轻量化动态装饰的场景。

丝带光标
Canvas超轻量丝滑线条光标跟随动画(3KB纯JS实现)这是一款令人愉悦的卷曲光标跟随效果,基于Canvas+原生JS实现,超轻量级,仅3KB大小,通过流畅的弹簧物理动画让光标像丝带般优雅扭动,适用于个人作品集、创意机构官网等需要增添趣味交互细节的场景。

液态遮罩
WebGL液态汽油花遮罩内容揭示效果,挥舞鼠标散开油渍液体关键内容逐渐显示这是一款液态内容揭示效果,基于WebGL技术实现,通过鼠标移动散开动态的液体遮罩,平滑地展示隐藏内容,适用于高端产品展示、创意网站开场等需要吸引用户注意力的场景。