Jump to content
GreenSock

Gledsley Muller

Members

  • Posts

    2

  • Joined

  • Last visited

 Content Type 

Posts posted by Gledsley Muller

    Same object, different "timeline" for different properties

    in GSAP

    Posted

    Hi,

     

    I have a text (blockquote) that should move from right to left constantly. It should start with opacity 0 then go to opacity 1 in 2 seconds. After that, it should keep moving constantly (same speed) for about 10 seconds and then fade out (back to opacity 0) but keep moving in the same speed.

     

    I've tried this way, but it doesn't get the correct movement I want:

     

    var tl = new TimelineLite();
    tl.to('.quote1', 2, { opacity:1, right:"+=50px", delay:3 })
    .to('.quote1', 10, { right:"+=150px" })
    .to('.quote1', 3, { opacity:0, right:"+=50px" });
     
    What I want to know is if it's possible to have a timeline for each property (e.g. "right" and "opacity") or if there is a better way to achieve the same result with only the object timeline...
×
Login Create Account