Does matchMedia work with utils? I have data attributes loading tweens with ScrollTrigger

[KristianW]

I'd like to implement reduced motion. Please offer some suggestions to the demo/codepen provided! (I've tried my code with basic syntax, conditional syntax, with context and without... ). I notice the matchMedia object (mm) in my debugger. I even see the key-value pair for reduceMotion nested in the object. The add method is undefined. I've tried meticulously to follow the documentation. I also tried removing the array code and attempted writing this tween with gsap.to and selector text  (w/ the data attribute) instead of the utils array method and loop. I'll be happy to implement any recommendations, thank you. I searched the forums as well...

See the Pen bGPGOrG by animating (@animating) on CodePen.

[Cassie]

Hi there

 

You were close! You currently only had one condition defined (reduceMotion) so the function was only being called when that condition matched. In order to animate you'll need to define a condition that runs when motion is allowed!

 

Quote

the function will get called when any of those conditions match and you can check each condition as a boolean (matching or not). 

 

Here you go!

 

See the Pen MWMWxKx?editors=1010 by GreenSock (@GreenSock) on CodePen.