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

7 votes367 views3 answers
Remove hover effect css
CSS
0 vote345 views1 answer
Override root css variables
CSS
0 vote356 views1 answer
Adding diffent style in firefox css
CSS
1 vote355 views1 answer
Align centre
CSS
0 vote367 views1 answer
Side nav bar in materialize css
CSS
7 votes340 views4 answers
List elements vertically in html
CSS
0 vote347 views1 answer
Flex item: 1;
CSS
2 votes347 views2 answers
Remove border iframe
CSS
0 vote370 views1 answer
Flex: 0 1 auto
CSS
0 vote348 views1 answer
Initialize toast
CSS