SuperAPI AI 工具集

anim-bounceindown

设计与创作

查看项目

更新于 10-16 10:35

技能介绍

用途 anim-bounceindown 提供 Animate.css 中的「Bounce In Down」CSS 关键帧动画,是一个可直接引入(drop-in)的入场动画片段,隶属于 motion-anything 项目。它不需要 JavaScript,适合用于为元素添加入场时的弹入下坠动效。

主要能力 以纯 CSS 关键帧动画的形式提供 Bounce In Down 效果;无需 JS 即可运行;会遵循 prefers-reduced-motion 偏好设置,在用户选择减少动态效果时禁用该动画。

使用方式

  1. 复制 bounceInDown.css 文件。
  2. 为目标元素添加 bounceInDown 类,并设置 animation-duration。

适用场景 适合用作快速、即插即用的 CSS 入场动画。

限制 应保持克制:不要在同一时刻对大量元素使用,也不要把该动画施加于必须阅读的内容上。

授权与可访问性 该动画来自 Animate.css,采用 Hippocratic License 2.1 授权,版权归 Daniel Eden 所有;使用时需按要求注明 Animate.css(Hippocratic-2.1)。在 prefers-reduced-motion 生效时动画会被禁用。