Homepage pulse animations ignore reduced-motion settings, while JavaScript effects honor them
A developer audited a trivia website's codebase and its live stylesheet and found that reduced-motion preferences are respected in six JavaScript implementations but not in CSS. Three pulsing elements on the homepage, used as waiting indicators, animate regardless of a visitor's motion settings because the stylesheet has no matching rule. The author notes that a spinner keyframe is shipped to all public pages even though none use it. The proposed fix is a three-line CSS media query disabling the pulse animation under reduced motion. The post also explains that an earlier reduced-motion rule existed briefly but covered a marquee that has since been removed.
This is an AI-generated summary. ShortSingh links to the original source for the complete article.


Discussion (0)
Log in to join the discussion and vote.
Log in