내 CSS 애니메이션을 멈추는 방법

Question

:hover으로 애니메이션을 멈추고 자 노력하고 있지만 시도하지 않아도 작동하지 않습니다. 나는 animation-play-state: paused;과 다른 속임수를 시험해 보았습니다. 이것은 약 4 일 동안 저를 망치고 있습니다.

내 코드는 https://jsfiddle.net/jbnx9gf8/이고 작동하지 않는 샘플은 다음과 같습니다.

.circle:hover{ 
    transform: scale(2,2); 
    margin:auto; 
    -webkit-animation-play-state: paused; /* Chrome, Safari, Opera */ 
    animation-play-state: paused; 
} 

애니메이션은 공중 선회 할 때 중지하고 내가 더 얻기 위해 그것을 가지고 공중 선회하지 않을 경우 계속해야하지만 그게 전부

Answer 1

당신은 당신이했습니다 애니메이션을 일시 정지 할, 그래서 만약 당신이, circle:before에 애니메이션을 적용 로 코드 :

.circle:hover:before{animation-play-state: paused;}

그것은 당신을 위해 작동합니다. 여기 Edited fiddle을 확인하십시오.