用途:为界面设计页面过渡与动效编排,涵盖页面切换、元素交错出现和整体动效序列的节奏控制。
主要能力: 页面过渡类型:淡入淡出(通用、安全、极简,200-300ms);滑动(表达方向关系,前进/后退、上/下,300-400ms);共享元素(元素在页面间变形,如照片展开为详情,400-500ms);无过渡(快速导航时即时切换也可取)。 过渡规则:退出快于进入(退出150ms,进入250ms);方向表示层级(右滑为更深层,左滑为返回);无关页面之间不做过渡,直接切换;仅在存在明确视觉关联时使用共享元素过渡。 交错模式:以CSS动画配合逐项延迟实现,如 .item 使用 fadeInUp 300ms ease-out both,第1项延迟0ms、第2项50ms、第3项100ms。 交错规则:项间延迟30-80ms;最多交错8-10项(总序列控制在500ms内);超出上限的项在末尾一起出现;交错方向为从上到下或从左到右,与阅读顺序一致。
使用方式:按上述时长与延迟参数编写CSS动画与过渡,控制页面切换和列表入场节奏。
适用场景:页面导航切换、列表或卡片入场、需要表达层级关系的界面动效。
限制:资料未提供具体框架、平台或工具集成方式,也未提供收费、价格或效果保证等信息。