prefers-reduced-motion #65
Description
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);
});
}
};