核心知识
prefers-reduced-motion
用户可在系统中表达减少动态偏好,页面应关闭或显著减弱非必要动画。
- 通过媒体查询检测
- 保留必要状态变化
- 不要把关闭动画等同于删除反馈
@media (prefers-reduced-motion: reduce){
.badge, .notice {
animation: none;
transition: none;
}
}
用户可在系统中表达减少动态偏好,页面应关闭或显著减弱非必要动画。
@media (prefers-reduced-motion: reduce){
.badge, .notice {
animation: none;
transition: none;
}
}