prefers-reduced-motion

[rober423]

looking at your animation and velocity files in 4X/Modules, and I noticed there's no mention of prefers-reduced-motion CSS. I would think you would want the animation module to be sensitive to prefers-reduced-motion without needing the developer to add it on later. For your case, I would suggest forcing a duration of 1ms if prefers-reduced-motion is reduce, if what I'm seeing at line 3554 of Velocity.js is what I think it is.

For example, I am currently working on creating a pull request for JGrowl and I made the following function to help with this:

const prefersReduced = window.matchMedia((prefers-reduced-motion: reduce)) === true || window.matchMedia((prefers-reduced-motion: reduce)).matches === true;

//function parameter func must include $(this).show() or .remove()/.hide() for use when prefersReduced is true.
$.fn.jGrowlAnimate = function( properties, duration, easing, func, funcArgs ) {
if (prefersReduced) {
if (typeof func === 'function') func.apply(this, funcArgs);
return $(this);
}
else {
return $(this).animate(properties, duration, easing, function() {
if (typeof func === 'function') func.apply(this, funcArgs);
});
}
};

[accdc]

Thank you for passing this along, adding this sounds like a good idea. :)

Can I ask you a favor, can you make the change and submit this as a pull request for the project?

I am totally blind and am not certain I will be able to add this without breaking something visually.

Thank you, and best wishes,
Bryan Garaventa