클래스 제거 시 CSS 애니메이션이 중지되는 것을 방지하는 방법
<p>그리드가 있습니다.
백엔드로부터 업데이트 메시지를 받으면 3초 이내에 행을 주황색으로 강조 표시해야 합니다.
업데이트를 받으면 CSS 클래스 '강조 표시'를 내 행에 추가하고 애니메이션을 재생합니다. </p>
<p>
<pre class="brush:css;toolbar:false;">.highlight {
애니메이션 이름: 하이라이트;
애니메이션 지속 시간: 3초;
}
@keyframes 하이라이트 {
0% {
배경색: 주황색;
}
99.99% {
배경색: 주황색;
}
}</pre>
</p>
<p>애플리케이션의 메시지 흐름에 대한 어떤 이유로 인해 3초가 지나기 전에 하이라이트 클래스를 제거해야 애니메이션 작동이 중지됩니다. 애니메이션이 3초가 끝날 때까지 재생되기를 원합니다. </p>
<p>하이라이트 클래스를 삭제해도 애니메이션을 끝까지 재생하려면 어떻게 해야 하나요? </p>