Css start animation on hover

button{
  animation: rotate360 1.2s linear infinite;  /* animation set */
  animation-play-state: paused;               /* put paused */
}
button:hover{
  animation-play-state: running;              /* trigger on hover */
}
@keyframes rotate360 {                        /* keyframes of animation */
  to { transform: rotate(360deg); }           
}

Source: stackoverflow.com

Similar codes

1 vote190 views1 answer
Css on hover do something to children
CSS
1 vote181 views1 answer
Mat stepper custom css
CSS
0 vote196 views1 answer
Responsive gradient background css
CSS
6 votes200 views1 answer
Hidden vs visible
CSS
2 votes192 views1 answer
Css focus outline none
CSS
0 vote219 views1 answer
Css feather border
CSS
0 vote208 views3 answers
Scroll elementleft using js
CSS
0 vote221 views1 answer
Css not last of type
CSS
3 votes193 views1 answer
Responsive flexbox in css
CSS
0 vote170 views1 answer
Css different rules on different devices
CSS