개발공부 임고미

공식 사이트 트윈 : greensock.com/docs/v3/GSAP/Tween 1. callbackScope( onStart, onUpdate, onComplete 등) 주로 쓰는것 : onComplete tween이 완료될때 실행시킬 함수가 있는경우 사용합니다. 2. delay (지연) 지연을 주고 싶을때 사용합니다. 3. duration (기간) 얼마나 걸릴지 결정해줍니다. 설정해주지 않는다면 0.5가 기본값입니다. 4. repeat (반복) 말그대로 반복을 의미합니다. Default는 0 이며, 반복하고 싶은 숫자를 넣어주면 됩니다. 무제한으로 실행시키고싶으면 -1 을 넣어줍니다. 5. yoyo 참고 : css animation 효과인 animation-direction: alternate; 와 ..

트윈맥스는 다양한 애니메이션을 만들기에 너무 유용한 라리브러리 입니다. 또 리액트도 지원해줘서 다양하게 활용이 가능합니다. greensock.com에 문서정리가 잘 되어있어서 딱히 블로그 글을 읽지 않고 원본 문서들만봐도 충분히 활용 할 수 있겠지만 실무를 하면서 유용하게 자주 사용한던 메소드와 기능들을 위주로 블로그글을 적어나가보고자 합니다! installation : greensock.com/docs/v3/Installation 1. CDN 간단하게 cdn 으로 불러올 수 있습니다. html 하단에 다음과 같이 불러옵니다. js에서 사용하는 방법입니다. 간단하게 gsap으로 불러와, 문법에 맞게 작성해주면 됩니다. //js gsap.from('.circle', 5, { x: 500, opacity: ..