SuperAPI AI 工具集

pixel-transition

设计与创作

查看项目

更新于 10-16 01:36

技能介绍

用途:为卡片添加悬停时的像素化揭示动画,让卡片正面通过像素方块爆开过渡到背面,形成复古风格的翻转效果。

主要能力:无第三方依赖;兼容 prefers-reduced-motion,在用户开启减少动态效果时背面直接显示,不做像素动画。

使用方式:复制其 CSS 与 JS,使用如下结构:<div class="pixt"><div class="front">…</div><div class="pixt-back"></div></div>,其中 data-grid 用于设置像素密度。

适用场景:适合少量卡片的交互展示,而非整片网格布局。

限制:资料未提供具体浏览器兼容范围、性能数据、安装命令或更多配置项,暂未提供。