question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Feature Request] Prefers Reduced Motion

See original GitHub issue

We should be inclusive to those who prefer reduced motion, including those who are prone to motion sickness or are epileptic by adding CSS classes to reduce animations where there is a prefers-reduced-motion media query. The article uses the following code snippet as an example of how it could look:

/*
  If the user has expressed their preference for
  reduced motion, then don't use animations on buttons.
*/
@media (prefers-reduced-motion: reduce) {
  button {
    animation: none;
  }
}

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:8

github_iconTop GitHub Comments

2reactions
bodymovincommented, Mar 1, 2020

you can set autoplay: false to render only the first frame

0reactions
tomasdevcommented, Mar 20, 2021

Ended up using goToAndPlay(lastFrame, true)

Read more comments on GitHub >

github_iconTop Results From Across the Web

prefers-reduced-motion - CSS: Cascading Style Sheets | MDN
The prefers-reduced-motion CSS media feature is used to detect if the user has requested that the system minimize the amount of ...
Read more >
prefers-reduced-motion: Sometimes less movement is more
The prefers-reduced-motion media query detects whether the user has requested that the system minimize the amount of animation or motion it ...
Read more >
"prefers-reduced-motion" | Can I use... Support ... - CanIUse
CSS media query based on a user preference for preferring reduced motion (animation, etc). ... CSS at-rule: @media : prefers-reduced-motion media feature.
Read more >
Revisting prefers-reduced-motion - CSS-Tricks
While prefers-reduced-motion is relatively new, CSS features and functionality ... It will work when a person has requested a reduced motion ...
Read more >
Respecting Users' Motion Preferences - Smashing Magazine
The `prefers-reduced-motion` media query has excellent support in all modern ... will require more of a user's data than a static image).
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found