SVGs have a built in function called pauseAnimations, and also unpauseAnimations, which allows you to stop an animation in its tracks.
SVGSVGElement.pauseAnimations()
Suspends (i.e., pauses) all currently running animations that are defined within the SVG document fragment corresponding to this <svg> element, causing the animation clock corresponding to this document fragment to stand still until it is unpaused.
Accessibility First DevRel. I focus on ensuring content created, events held and company assets are as accessible as possible, for as many people as possible.
Well that solves SMIL and I was today years old when I learned about SVG pauseAnimations!
I was thinking about it and would the following not work for CSS applied animations in 99% of circumstances (I know a more specific selector with !important would obviously slip through but other than that I think it would work?)?
SVGs have a built in function called
pauseAnimations, and alsounpauseAnimations, which allows you to stop an animation in its tracks.developer.mozilla.org/en-US/docs/W...
Here's a very basic demo
Well that solves SMIL and I was today years old when I learned about SVG pauseAnimations!
I was thinking about it and would the following not work for CSS applied animations in 99% of circumstances (I know a more specific selector with
!importantwould obviously slip through but other than that I think it would work?)?