用途:为元素提供可组合的声明式入场动画,用属性而非手写关键帧来控制淡入、位移、缩放、旋转等效果。
主要能力:在元素的 xyz 属性中混合多种效果,例如 xyz="fade rotate-right-45",并通过切换 xyz-in / xyz-out 类来触发入场与出场。
使用方式:1) 引入 @animxyz/core 的 CSS;2) 在目标元素上设置 xyz="fade rotate-right-45";3) 切换 xyz-in / xyz-out 类。
适用场景:需要快速实现无需手写关键帧的入场动效。
限制与注意:应避免为单个效果引入约 100KB 的核心 CSS,也不宜在大量元素上过度使用;在 prefers-reduced-motion 下不自动播放。许可为 MIT。