Spring · The feel of a bounce
Interruptible animation可打断动画
- responsive
- fluid
- agile
If the user acts halfway through, the animation turns toward the new target from where it is, without snapping back to the start first.
When to use it
Anything clicked or dragged repeatedly must be interruptible; only one-off actions such as a dialog can ignore this.
Parameters
no CSS transition · interpolate from current value each frame · 180ms total · target can change anytime
Recipe
Interruptible animation → 180msInterruptible animation → no CSS transition · interpolate from current value each frame · 180ms total · target can change anytime
One sentence for your AI
Make this toggle interruptible: skip CSS transitions and interpolate from the current value toward the target each frame over 180ms, so a mid-flight reversal turns from where it is.