CSS3 애니메이션 - 모든 루프를 멈추기

Question

CSS3 애니메이션을 이해하려고했습니다. 나는 다음과 같은 예를 들었다 : morphing-cubes

이 무한 루프의 경우, 매 루프마다 두 번째 정지하고 싶었다. (링 모델에서). 지연을 사용하면 애니메이션 시작 부분에서 멈 춥니 다. 모든 루프를 시작할 때 어떻게 지연시킬 수 있습니까?

난이도 옵션을 사용하여 멈춤 느낌을주고 즉시 시작합니다.

Answer 1

지연이 필연적인지 여부는 확실하지 않습니다. 키워드 값 "from"및 "to"대신에 백분율 (밀리 초 표시)을 사용하십시오. 나는 데모를 가져 와서 이것을 구현했다. idk가 정확히 당신이 그것을 상상 한 방법이지만, 각 회전 후에 멈추고 있습니다. 원하는 효과를 얻으려면 한계에 더 많거나 적은 백분율을 추가하여 원하는 효과를 얻을 수 있습니다.

http://jsfiddle.net/jalbertbowdenii/MLfyv/