Since Chrome version 74, prefers-reduced-motion
media queries will be set with reduce
value in case the user has disabled animations in controls inside Windows.
I'm a developer and our project at work includes Bootstrap (I'm not fond of it at all). I'm on Win 10 and use mostly Chrome for testing. Animations weren't working on my computer but looked fine on other machines. After googling it, I re-enabled animations in controls inside Windows and voila – they started working.
That said, I think it's pretty annoying that we don't have a way to tell Chrome not to follow these system-wide flags. As the article cleverly points out, I do disable most of Windows's standard animations because I favor performance instead of useless and cumbersome "eye-candies" – but as a web developer, I want them on in Chrome regardless of however I want my OS in general to behave.
I tried looking for Chrome extensions but to no avail. Also looked for settings inside chrome://flags
and wasn't able to find anything.
Am I missing anything? Are there any ways I can intervene with Chrome trying to be helpful and being extremely inconvenient instead?
Update 2020-03-18
I can cope with injected scripts – I don't care if it's a flag anywhere on the system or if it has to be done programmatically.
Just to be thoroughly clear:
I want Windows animations under System > Properties > Performance > Settings to be turned off, including animate controls inside Windows, but still be able to see animations in Chrome (if the purple box in this link was all shaky-shaky, then it is working).
Best Answer
If you wish to disable the
prefers-reduced-motion
option in the CSS, use a browser extension/add-on to remove it when it is not needed.You may use:
For information about manipulating the CSS see for example Manipulating Stylesheets with Greasemonkey.