Question
Configuring scroll-behavior to respect prefers-reduced-motion
Kavi Dey
0 reputation · 30 May 2023, 02:30 UTC
88.6K views0
Goal
Ensure that smooth scrolling initiated via the CSS scroll-behavior property automatically respects a user’s prefers-reduced-motion: reduce setting without requiring JavaScript overrides.
Constraints
The CSS Scroll Behavior specification does not define how scroll-behavior should interact with media features, leading to inconsistent browser implementations where smooth animation runs regardless of motion‑reduction preferences.
- Should scroll-behavior honor prefers-reduced-motion: reduce by default?
- If not, what CSS‑only mechanism can developers use to suppress smooth scrolling when the media query matches?
- How can the behavior be reliably tested across Chrome, Firefox, and Safari without resorting to script‑based scrolling?