Canvas解结游戏
解结（拖点消交叉益智 HTML 小游戏）这是一款极简风格的解结益智HTML小游戏，基于 Canvas 2D 绘制、原生 JavaScript 与 GSAP 动画实现。屏幕上散布着由线段相连的圆点，初始状态线条彼此交错；玩家逐个拖动圆点...
CSS 3D火柴盒
纯CSS 3D火柴盒（可拖拽旋转的复古模型）这是一款可交互的 3D 复古火柴盒模型，基于 HTML+CSS 3D 变换与原生 JavaScript 实现。盒身由多个立体面拼搭而成，覆上噪点纸纹与木纹渐变，还原纸板的粗糙手感；侧面磷面带有排...
GSAP轮播
GSAP 流媒体首页轮播特效 — 仿 Netflix 拖拽切换，无限循环带视差这是一款流媒体首页轮播效果，基于 GSAP + Draggable 实现，整体是仿 Netflix 那类影视平台的界面。屏幕中央是当前主推的片子，海报大图配上标题、匹配度、年份、分级、画质标签和...
模拟风力
HTML5 Canvas 物理阻尼风速滑块交互特效 | 网页拟真物理反馈微动效这是一款物理阻尼风力滑块效果，基于HTML5 Canvas与JavaScript技术实现。用户在拖拽滑块时，不仅能实时改变风速数值（MPH），还能体验到由物理循环算法模拟出的风阻、阵风与随机湍流...
爱心眼神跟随
HTML/JS趣味爱心眼神跟随鼠标交互特效 | 创意微拟物网页动效这是一款趣味爱心眼神跟随效果，基于HTML+CSS+JavaScript技术实现，画面中央的拟物风爱心拥有一双灵动的眼睛，能够实时追踪鼠标指针的移动，并根据鼠标的远近距离产生自然的呼吸起伏与光晕...
趣味倾倒音量滑块
可交互悬停式音量滑块动效组件（CSS+JS）这是一款基于 CSS+JavaScript 实现的悬停式音量控制滑块效果。它通过鼠标悬停即可调整音量大小，滑块会随数值变化动态倾斜、填充进度，搭配霓虹质感的发光效果，交互反馈清晰直观，适用于音视...
重组卡片
React+Framer Motion 可拖拽重排名片组件，专业级卡片拖拽排序交互动效开发模板这是一款面向前端开发与 UI 设计场景的专业级可拖拽重排名片卡片交互效果，基于React 19 + Framer Motion技术栈原生实现，核心复用 Framer Motion 内置的 Reo...
越轨滑块
会"越轨"的滑块拖动特效（CSS+JS） | 带物理引擎的趣味交互组件这是一款可脱轨的滑动条效果，基于 CSS + JS 技术实现。正常状态下它就是个普通的 MIN/MAX 滑块，蓝紫渐变轨道，拖动显示百分比，规规矩矩。但把滑块拖出两端边界后，它就彻底"不守规矩"...
比对滑块
图片前后对比滑块，原生JS+CSS变量实现的响应式对比工具这是一款基于原生JavaScript（仅两行代码）和CSS变量实现的图片前后对比滑块组件，专为展示图片修复、图片压缩、设计迭代、产品优化等前后差异场景设计。交互逻辑直观高效：中间的垂直分割线配有...
数字调节器
简易版 CSS 垂直数字进度微调器组件源码这是一款纯CSS实现的数字进度条动画效果，采用竖向设计，绿色光效进度条随数值变化动态上升，顶部显示当前数字，底部配加减按钮可手动调节。整体风格极简科技感十足，搭配深色背景与发光细节，视觉反馈清晰...
圆形滑块
六款自定义圆形及半圆形范围滑块组件（CSS+JS），适合温度调节、仪表盘、播放器等多场景使用的数据调节控件这是一款自定义圆形范围滑块效果，基于前端技术实现，支持全圆、半圆及弧形多种布局，支持自定义刻度与标签，视觉直观且交互灵活，适用于仪表盘设计、温度控制器、音乐播放器、进度展示、参数调节等场景，尤...