Press Bounce
Press to triggerSprings back with a short kick so the click clearly registered.
Hold the box down
Triggered by
:active Hold the box down, release, and it replays.
Tune parameters
Interactive animations are driven by pointer state; duration and easing live on
transition / animation — change the numbers in the code below.
Full code
/* Press Bounce */
@keyframes pressBounce {
0% { transform: scale(.9); }
45% { transform: scale(1.06); }
100% { transform: scale(1); }
}
.anim-press-bounce:active {
animation: pressBounce .4s cubic-bezier(.34,1.56,.64,1);
}