用途
Zoom Out Down 是一个 CSS 关键帧退出动画,用于让元素以缩小并向下移动的方式从界面中退场。它源自 Animate.css(Hippocratic License 2.1,© Daniel Eden),是 motion-anything 项目的一部分,定位为即插即用的动画样式。
主要能力
该动画以纯 CSS 关键帧实现,无需 JavaScript 即可运行。它支持遵循系统的 prefers-reduced-motion 偏好设置,在用户开启减少动态效果的选项时该动画会被禁用。
使用方式
按照资料说明,使用方法分为两步:第一步,复制 zoomOutDown.css 文件;第二步,为目标元素添加 zoomOutDown 类,并设置 animation-duration(动画时长)。
适用场景
适用于需要为元素添加快速离场动画的场景,作为即插即用的 CSS 退出动画使用。
限制
资料中给出的使用克制建议包括:避免同时为大量元素使用该动画,以及不要将其用于必读内容。此外,在 prefers-reduced-motion 启用时该动画会被禁用。
许可与归属
该动画采用 Hippocratic License 2.1 授权,版权归 Daniel Eden 所有,使用时需对 Animate.css 进行署名。