search

w3c / css-houdini-drafts

Mirror of https://hg.css-houdini.org/drafts
https://drafts.css-houdini.org/
Other
1.84k stars 141 forks source link

[css-animationworklet] Use prefer-reduced-motion in some examples #903

Open majido opened 5 years ago

majido commented 5 years ago

Animation Worklet deals with animation that can potentially have motion. While it is still up to authors to determine how to take the prefer-reduced-motion hint into account it makes sense for use to highlight it in our examples to create awareness and also show some best practices.

majido commented 5 years ago

Here I have provided at least to examples for how to use prefer-reduced-motion with AnimationWorklet.

A - Use similar to Web Animations to control if and what type of animation needs to be played. I believe this is the most common pattern.

B - Pass it to animator as part of options so that animator logic can be customized. This is probably the minority of cases. Right now my example causes the animation to reach its final frame immediately when user prefers reduced motion. This is probably not a great example since it is better to just not create the animation in this case (i.e., use method A). Need a better example where we still want some customization but reduced motion.