键盘导航轮播
响应式轻量级图片轮播,现代 JS 键盘导航懒加载轮播组件这是一款响应式轻量可访问图片轮播效果,基于现代 JavaScript 技术实现,支持键盘无障碍操作、平滑滚动切换、缩略图懒加载、相邻图片预加载,加载快、交互稳、适配全,相比普通轮播,对键盘用户更...
仿 macOS 导航栏
仿 macOS Dock 风 GSAP 动态导航栏交互动画效果这是一款基于 GSAP+CSS 实现的仿 macOS Dock 风动态导航栏效果。它模拟了 macOS 程序坞的丝滑交互,面板切换过渡流畅,按钮状态自适应变化,整体风格简约高级,适用于桌面端管理...
玻璃质感导航栏
苹果风液态玻璃导航栏交互效果(CSS+JS),明暗双主题网页导航组件这是一款苹果风液态玻璃质感导航栏交互效果,基于 CSS+JS 技术实现,适配明暗双主题模式,自带顺滑的菜单项切换动效与细腻的悬停微光反馈,通透的玻璃拟态视觉高级感出众,交互流畅自然,适用于品牌官...
艺术画廊
专业级 GSAP 可拖拽图片画廊,摄影作品集缩放预览交互官网开发模板这是一款面向摄影、艺术、设计赛道的专业级可交互图片画廊系统,基于GSAP 动画库原生开发,核心复用 GSAP 官方 Draggable 拖拽引擎、InertiaPlugin 惯性动效、Custo...
凹面无限图库
WebGL 交互式凹面畸变无限图片画廊,沉浸式前端创意交互效果这是一款沉浸式交互式无限图片画廊效果,基于 WebGL 技术实现,自带实时鼠标响应的向内凹面畸变特效,能呈现出包裹感极强的弧形曲面网格视觉效果。支持拖拽平移无缝图片矩阵、滚轮或键盘快捷导航,还可...
滚动联动画廊
纯 CSS 实现滚动联动导航图库预览效果这是一款基于纯 CSS 实现的图片画廊导航效果,综合运用了 :target-before、:target-current、:target-after 伪选择器、CSS 锚点定位(Anchor P...
倾斜悬浮卡片
纯 CSS 实现 3D 倾斜卡片横向画廊这是一款基于纯 CSS 3D 变换实现的横向滚动卡片画廊。默认状态下所有卡片以统一的透视倾斜角度排列,像一排被推倒的多米诺牌,本身就已经很有空间纵深感。悬停时焦点卡片「站直」回正,虚线边框浮现,...
固定导航栏
CSS 滚动感知吸顶导航 + 动态锚点指示器这是一款基于 CSS container-type: scroll-state + anchor-positioning + :target-current 实现的智能吸顶导航效果,无需 JS ...
手绘下划线
纯 SVG + CSS 实现的 9 种不同风格手绘下划线悬停动画效果这是一款手绘下划线悬停动画效果,基于CSS动画+SVG Symbols+极简JavaScript技术实现。鼠标悬停导航文字时,会出现手绘风格的下划线,带有轻微的不规则感和动态描绘过程,每次显示还...
自定义下拉框
纯 CSS 文件夹堆叠3D扇形下拉选择效果这是一款文件夹堆叠下拉选择效果,基于纯CSS技术实现。通过重新设计原生的<select>选择器,将传统的下拉列表改造成了立体的文件夹堆叠形态。每个选项都以文件夹图标呈现,采用扇形排列,从上到下依...
不规则卡片布局
CSS 不规则网格凹陷圆角卡片布局这是一款不规则网格凹陷圆角卡片效果,基于CSS Grid和高级圆角技术实现。卡片采用了反向圆角设计,在包裹按钮或其他元素时,边缘会向内凹陷形成优雅的弧线,而不是传统的外凸圆角。最巧妙的是卡片与内...
按钮加载特效
CSS 多场景分类卡片+按钮入场动画 - 动态交互式图标网格导航布局这是一款基于纯 CSS 实现的响应式图标卡片导航效果,专为多场景分类入口设计。整个界面采用深色系背景,8个圆角卡片呈4×2网格布局,每个卡片内包含线性图标和对应文字标签。核心亮点在于交互动效以及...