查询动画
CSS定制搜索中动画效果（眼睛注视放大镜加载中动画）使用CSS实现的创意搜索动画效果，这是一种点击查询按钮且搜索结果未出现之前的一段动画效果，呈现的效果是：转动的眼球注视放大镜，且上方带有加载状态的三点动画。整个动画效果全是基于CSS实现的不依赖...
图标动画
SVG与CSS实现的无限符号图标边框流动动画效果基于CSS的keyframes、transform以及animation等关键属性实现的带边框流动效果的无限符号图标，可通过「切换主题」以及「切换轮廓」功能按钮查看不同的效果。无限符号使用的sv...
渐变色背景
CSS实现视口渐变旋转背景通过CSS的keyframes以及animation等关键属性实现的持续旋转的渐变色背景。在用户的浏览器窗口（viewport）内，渐变色块沿着Z轴进行旋转，页面设置了旋转方向以及全屏两个功能...
倾斜面板
CSS实现响应式面板倾斜排列布局，附带悬停面板扩大效果使用 CSS 中的 Flexbox 布局结合变形（skew）变换实现了倾斜面板排列效果。默认是横向的排列布局，针对较小屏幕的设备，布局会自动调整为纵向布局，具有将强的自适应能力，并且在鼠标悬停时...
网格布局
CSS实现响应式网格菜单布局通过CSS实现的响应式菜单网格布局，无论是手机、平板还是电脑设备都能良好展示。在页面的左上方设置了一个典型的三条杠菜单图标按钮，点击该按钮会呈现出全页面的菜单网格布局，这时候左上角的菜单按钮变为...
轮播插件
React 实现带鼠标追随效果的轻量级轮播切换组件，完全响应式布局！使用 React 构建的轻量级轮播与幻灯片插件，外观特别的时尚大方简约，其中的鼠标追随效果是通过设置当前幻灯片的 x 和 y 坐标的CSS值，以便在鼠标移动时创建跟踪鼠标的动态过渡效果。切换等交...
交互卡片
CSS卡片悬停互动效果，交互性强的响应式卡片布局使用纯CSS实现的卡片悬停互动效果，在HTML页面中布局多张卡片，这些卡片以响应式的布局进行排列，并且卡片上默认会有一部分标题文字，当鼠标悬停于卡片时会在卡片中央位置显示出卡片的详细介绍以及操...
个性单选
CSS自定义高颜值radio单选按钮，附带选中交互动画效果基于CSS实现的一款颜值优异的自定义单选框，底层了CSS的transform、transition以及box-shadow等关键属性实现。当选中按钮时会伴随着「实心圆」变为「空心圆」的动画效果，...
选中撒花
CSS单选框创意选项切换效果，点击选项出现撒花庆祝动画！通过CSS的keyframes及animation等关键属性实现的单选框切换选项动画效果，当选项被选中时显示撒花、撒纸屑庆祝动画效果，可用在单选框复选框以及其他按钮点击事件上，增加点击的趣味性。
悬停幻灯片
JavaScript带悬停效果的环绕型内容轮播插件这是一款现代的多功能时尚的带悬停效果的环绕型内容轮播插件，是基于JavaScript与CSS实现的，其中CSS负责外观及布局，JavaScript负责实现切换事件以及鼠标悬停事件。切换插件的下方...
AI火花按钮
CSS生成 AI 动画按钮，悬停按钮时显示霹雳火花动画效果你肯定猜不到这个AI动画按钮是由一张图片和一个视频制作的！按钮静止状态下其实是一张带闪电的图片，当鼠标悬停到按钮（闪电图片）上时触发的霹雳火花动画其实是个1秒钟的视频，这个视频是通过询问AI「最...
个性开关按钮
CSS制作的Emoji表情开关切换按钮使用CSS实现的多功能时尚开关切换按钮，按钮上的滑块处于关闭状态时呈现的是「难过」Emoji表情，当打开开关时呈现的是「快乐」的Emoji表情，而且在滑动开关时Emoji表情滑块是以滚动的动画效...