返回 Pack GalleryMotion Pack 12 · 内容变化
详情展开
让被收起的信息在原有位置打开，内容与触发器保持清晰关联。
实现一个详情展开：点击标题行后，箭头旋转，内容区通过高度和透明度在 220ms 内展开；再次点击平稳收起。避免让页面其余部分发生突兀跳动。
动效规则
箭头、可见内容和辅助说明同步表达展开状态。
减弱动效
直接展开或收起内容，保留 aria-expanded 状态。
实现
HTML、CSS 与行为所需的 JavaScript 一起复制。
让被收起的信息在原有位置打开，内容与触发器保持清晰关联。
实现一个详情展开：点击标题行后，箭头旋转，内容区通过高度和透明度在 220ms 内展开；再次点击平稳收起。避免让页面其余部分发生突兀跳动。
箭头、可见内容和辅助说明同步表达展开状态。
直接展开或收起内容，保留 aria-expanded 状态。
HTML、CSS 与行为所需的 JavaScript 一起复制。