티스토리

STUDY ROOM
검색하기

블로그 홈

STUDY ROOM

seonn35.tistory.com/m

seonn35 님의 블로그입니다.

구독자
1
방명록 방문하기

주요 글 목록

  • staggerTo(), staggerFrom() for문 같이 연속되는 동작을 할 수 있도록 만들어줌 TweenMax.staggerTo(".class", 1, {y:"+=150", opacity:0}, 0.2); .class 를 y는 150 만큼 이동, opacity는 0으로 변경, 0.2초마다 다음 .class로 옮겨가면서 실행 아래에서 실행되는거 확인 가능 See the Pen TweenMax StaggerTo by seonn (@seonn) on CodePen. 아래는 stagger를 이용해서 글자가 흩어지는 애니메이션을 구현 See the Pen Shattering Text Animation by Arsen Zbidniakov (@ARS) on CodePen. 공감수 0 댓글수 0 2019. 2. 14.
  • fromTo() TweenMax.fromTo( target:Object, duration:Number, fromVars:Object, toVars:Object ) TweenMax.fromTo("#target", 3, { left : 0 }, { left : "200px" }); 스타일시스에 명시된 값을 무시하고 fromVars 에서 toVars 로 이동 #target이 우측으로 200px 만큼 이동한다. 공감수 0 댓글수 0 2019. 2. 14.
  • to(), from() TweenMax.to( target:Object, duration:Number, vars:Object ) .to() stylesheet(css)에 명시된 값에서 출발하여 해당구문에 명시된 값까지 변화하는 애니메이션 #target{left:0;} tweenMax.to("#target", 3, { left: "200px" }); #target 이라는 오브젝트를 3초동안 우측으로 200px 만큼 이동 TweenMax.from( target:Object, duration:Number, vars:Object ) .from() 해당구문에 명시된 값에서 출발하여 스타일시스에 명시된 값까지 변화 (to와 반대방향) #target{left:200px;} tweenMax.from("#target", 3, { left: ".. 공감수 0 댓글수 0 2019. 2. 14.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.