There is a nifty feature in Chrome's Developer Tools which allows you to pause animations and control their speed, but the problem is they're mouse-controlled buttons. Sometimes I need to pause an animation without actually moving the mouse cursor to inspect something inside a hover-activated animation, so I can't really use the pause button. Is there a keyboard shortcut for that animation pause button so I don't need to move the cursor off whatever I'm doing?
As previously mentioned, there's no keyboard shortcut to pause an animation, but I've found the next best thing: Using Ctrl+Shift+C (Cmd+Shift+C in Mac) to enable inspecting while the cursor is on the element with the hover activated animation. That doesn't stop already running animations, but prevents further mouse activated animations from triggering while inspecting, which might be enough to inspect an element.
No! Chrome DevTools has no such a shortcut. You can see the complete list of chrome DevTools Shortcuts at: https://developer.chrome.com/docs/devtools/shortcuts/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With