用途:Fade Up 是 AnimXYZ 提供的可组合入场动画,通过声明式属性实现淡入并向上位移的效果,无需手写 CSS 关键帧。
主要能力:可在一个 xyz 属性中混合 fade、move、scale、rotate 等动作,例如 xyz="fade up-3",通过数值调节位移强度。
使用方式:1. 引入 @animxyz/core 的 CSS;2. 在目标元素上设置 xyz="fade up-3";3. 通过切换 xyz-in / xyz-out 类控制入场与出场。
适用场景:需要快速为页面元素添加入场动效、又不想维护关键帧的项目。
限制:文档提到若仅为单个效果而引入约 100KB 的核心 CSS 并不划算,且不宜在大量元素上过度使用;无障碍方面遵循 prefers-reduced-motion,不会自动播放;许可为 MIT。