• 카테고리

    질문 & 답변
  • 세부 분야

    웹 개발

  • 해결 여부

    미해결

가로 세로 모두 있는 경우

22.02.10 21:12 작성 조회수 132

0

안녕하세요. 세로만 있는 경우는 다른 질문에도 

답변을 달아주셨듯이 y값 옮기면 될 것 같습니다. 

 

그런데 가로 세로 모두 있는 경우 

ex) 

0번 1번 2번 

3번 4번 5번

6번 7번 8번

의 경우 animation을 줄 때 2->3으로 이동할 때 

이미지 자체가 이동해서 중간과정이 이상하던데

혹시 이러한 경우는 안되는 것일까요?

답변 1

답변을 작성해보세요.

1

가로 세로를 같이 동작시키려면, CSS animation 대신 자바스크립트를 이용해서 위치 이동을 시켜주셔야 합니다. 실제로 예전에 CSS animation이 없던 시절에는 그렇게 사용을 했었답니다. 다만 그 경우에도 가로 세로를 굳이 같이 사용하면 스크립트가 복잡해지기 때문에, 특별한 이유가 있지 않은 이상은 한 방향으로만 하는게 좋다고 생각됩니다.
CSS를 사용할 수 없는 canvas에서 스프라이트 이미지를 이용해 애니메이션을 만드는 경우, 스크립트로 위치 이동을 시켜준답니다.