테스트 사이트 - 개발 중인 베타 버전입니다

css 에니메이션 @keyframe 질문드립니다. 채택완료

프렌치까페 4년 전 조회 1,747

날아다니는새 css 에니메이션을 구현하기위해 한소스를 찾아서 적용시키는 중이었는데요

@keyframes fly-right-one {          0% {         transform: scale(0.3) translateX(-10vw);     }          10% {         transform: translateY(2vh) translateX(10vw) scale(0.4);     }          20% {         transform: translateY(0vh) translateX(30vw) scale(0.5);     }          30% {         transform: translateY(4vh) translateX(50vw) scale(0.6);     }          40% {         transform: translateY(2vh) translateX(70vw) scale(0.6);     }          50% {         transform: translateY(0vh) translateX(90vw) scale(0.6);     }          60% {         transform: translateY(0vh) translateX(110vw) scale(0.6);     }          100% {         transform: translateY(0vh) translateX(110vw) scale(0.6);     }      } 해당부분을 작성하면 첫번째 0%부분만 활성화가 되고 나머지 10~100%까지 작성했던 부분이 무시가 됩니다.

혹시 다른방식으로 작성을 해야하는건지 방법알려주시면 감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트
4년 전

특별하게 문제될 건 없을 거 같은데요 이 소스상에선

로그인 후 평가할 수 있습니다

답변에 대한 댓글 3개

프렌치까페
4년 전
그런데 10%부터 적용이안되듯이 활성화가 안됩니다. 글씨색깔이 달라요
블랑숑
4년 전
0프로 부분 10프로랑 같게 하고 시작 테스트 해보세요
프렌치까페
4년 전
괄호하나 잘못쳐서 적용이 안됬었네요ㅠ

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인