跳跃小游戏
“别让我腐烂” 南瓜主题平台跳跃收集物品 HTML 网页小游戏源码下载这是一款 “别让我腐烂” 南瓜主题平台跳跃网页小游戏,基于原生 HTML、CSS 与 JavaScript 技术实现,玩家扮演会逐渐腐烂的杰克灯南瓜头,通过方向键 / WASD 控制移动、空格触...
数据卡片
原生CSS+JS实现地滑动式转化率数据仪表盘卡片 UI,轻量、兼容性好、触控体验极佳这是一款可滑动的交互式滑数据仪表盘卡片 UI(图片、文字及走势图),基于原生 HTML5、CSS3 与 JavaScript 技术实现,是移动端优先的数据分析展示组件。,支持手势滑动切换不同时间...
交互列表
支持响应式布局的 GSAP 音乐作品集交互式列表(带图片悬浮 + 闲置动画),这是一款适配音乐场景的交互式表格组件,基于GSAP动画库实现,重构了 HTML 的 ui 表格,加入了列表项的悬停与闲置状态动画效果,关键是支持响应式布局。表格里清晰罗列着音乐人、作品名等信息,...
视差轮播
纯原生 JavaScrip 视差轮播图文轮播组件,轻量高效,视觉惊艳!这是一款无第三方库的原生视差轮播效果,基于原生 JavaScript 技术实现,通过层叠元素和滚动位移模拟出深度感十足的视差动画,视觉层次分明,交互流畅自然,既支持自动轮播有支持通过底部以及左右...
小球穿洞
彩色弹球循环跳跃小洞加载动画效果(CSS+SVG),让等待变得有趣!这是一款弹跳彩球穿孔跳跃加载动画效果,基于CSS+SVG技术实现,通过巧妙的阴影和渐变营造出立体感十足的3D视觉效果,多个彩色小球在多个小洞中循环跳跃(还借助 SVG 剪切路径处理了洞口的细节,...
场景切换
CSS 滤镜+ Canvas 以全球变暖为主题实现震撼的冷暖场景切换效果,两张图片、两个世界!!!这是一款聚焦全球变暖的场景切换效果,基于 CSS 滤镜+ Canvas 技术实现,它把左侧冰雪、云海交织的清凉水域景观,仅通过滤镜处理就转化成了右侧熔岩遍布、黑暗笼罩的末日荒原,用强烈的视觉对比...
积雪网页
让网页也下雪(CSS+JS):一键生成真实感积雪边框!这是一款冬季主题的“积雪层”视觉效果,基于CSS实现,通过为任意元素添加“collider”类,即可在顶部自动生成自然的积雪边缘。画面中卡片顶部覆盖着不规则的雪堆,配合飘落的雪花背景,营造出浓厚...
资料卡片
用户资料卡片组件,支持明暗模式与丝滑的悬停详情展示动画这是一款支持明暗模式切换的动画用户卡片组件,基于 CSS 过渡动画技术实现,支持悬停卡片展示用户详细信息,并提供关注及粉丝数等功能按钮,此外还支持轻盈浅色与沉稳深色两种样式的平滑切换,卡片既能清...
品牌轮播
CSS 自动 logo 轮播(悬停暂停)效果,让品牌展示更自然这是一款横向自动滚动的Logo展示条效果,基于CSS实现,多个品牌标识(LOGO)在页面中持续平滑移动,滚动边缘有明显的锐化效果,鼠标悬停时滚动自动暂停,提升用户浏览体验。设计简洁大方,适合用于...
布局重排
CSS+GSAP 驱动的网格图片丝滑重排动画效果,以更优雅的方式切换布局这是一款网格布局重排动画效果,基于CSS、GSAP和Flip技术实现,当页面布局发生变化时(如切换大图/小图模式),图片能流畅地进行位置与尺寸的动态调整,避免生硬跳动。画面中古典画作在网格间平滑...
跳动下划线
自定义 SVG 上下跳跃动画“调皮”下划线效果这是一款自定义下划线动画效果,基于SVG与CSS实现,通过动态线条勾勒出文字下方的强调线,能给文字里的重点内容加上灵动的动态下划线(标记文字被一条绿色弓形波浪线轻轻托起,仿佛在传递一种克制却真挚...
首屏3D动画
用 WebGL 打造的沉浸式折射晶体玻璃态动画 Hero 首屏布局这是一款 WebGL 折射晶体玻璃态 Hero 首屏区域 3D 动画效果,基于 WebGL+GLSL 着色器技术实现,通过光线追踪渲染出晶莹剔透的折射晶体场景,搭配玻璃拟态风格的UI元素,营造出...