纯 CSS 打造的 3D 悬浮金属发光开关按钮

数字重力

纯 CSS 打造的 3D 悬浮金属发光开关按钮

这是一款次世代 3D 悬浮感应开关按钮,基于 纯 CSS(3D 透视变换 + 多重发光渐变) 技术实现。它彻底打破了扁平化 UI 的平面次元,通过 500px 的视距设定与 6 层模拟光子发光的...

基于 svg.js+checkbox 实现的6款丝滑交互动画效果切换按钮

丝滑开关

基于 svg.js+checkbox 实现的6款丝滑交互动画效果切换按钮

这是一款极简流畅的定制版checkbox开关切换组件,基于CSS过渡和svg.js控件实现,总共包含六种(偏移、旋转偏移、旋转、底部滑出、有序、随机)动画,每种动画都会呈现丝绸般顺滑的移动轨迹,...

CSS+JS带点状进度导航的丝滑自动图文轮播动画组件

自动轮播

CSS+JS带点状进度导航的丝滑自动图文轮播动画组件

这是一款自动滑动轮播动画效果,基于CSS过渡+JavaScript交互技术实现,支持通过底部的点状导航切换内容,同时也支持自动平滑切换和动态过渡,适用于轮播图和内容展示场景。

纯CSS实现的轻量级动态选项卡Tabs切换组件

Tab选项卡

纯CSS实现的轻量级动态选项卡Tabs切换组件

​这是一款轻量级Tab选项卡切换效果,基于纯CSS实现,通过平滑过渡和焦点状态切换内容面板,适用于网页内容分类展示或功能模块切换场景。

CSS带玻璃质感塑料材质的拟物化风格开关切换按钮

塑料开关

CSS带玻璃质感塑料材质的拟物化风格开关切换按钮

这款基于纯CSS实现的玻璃发光切换开关设计灵感来源于拟物化(Skeuomorphism)时代的设计风格,结合了现代材料与复古元素,创造出一种既时尚又具有怀旧感的交互切换组件。该开关采用透明玻璃材...

React 实现带鼠标追随效果的轻量级轮播切换组件,完全响应式布局!

轮播插件

React 实现带鼠标追随效果的轻量级轮播切换组件,完全响应式布局!

使用 React 构建的轻量级轮播与幻灯片插件,外观特别的时尚大方简约,其中的鼠标追随效果是通过设置当前幻灯片的 x 和 y 坐标的CSS值,以便在鼠标移动时创建跟踪鼠标的动态过渡效果。切换等交...