WebKit 博客文章“响应式运动设计”的减弱动态效果演示：响应式运动设计

要测试这些功能，请启用“减弱动态效果”设置。

• iOS： 设置 > 通用 > 辅助功能 > 减弱动态效果
• macOS： 系统偏好设置 > 辅助功能 > 显示 > 减弱动态效果
• Xcode 辅助功能检查器： 设置 > 减弱动态效果 (查看视频演示)

示例 1：使用 CSS 修改交互过渡属性

示例 2：使用 CSS 禁用正在进行的纯装饰性动画

示例 3：使用 JavaScript 访问当前值

示例 4：仅当 prefers-reduced-motion 受支持 *且* 关闭时显示动画版本。

此示例使用更明确的匹配条件 (prefers-reduced-motion: no-preference)，这会排除所有尚未支持此新功能的浏览器。

返回 WebKit 博客文章：响应式运动设计