Jump to content
GreenSock

iamsebastn

Give one part of timeline a different easing

Go to solution Solved by Trapti,

Recommended Posts

Hey people! 
I have one question. 

I have this animation:

tl.fromTo(
  ".main-wrapper",
  {
    blur: 20,
    opacity: 0
  },
  {
    blur: 0,
    opacity: 1,
    duration: 5,
    ease: "bounce.in"
  }
);

So far so good. The animation works fine.  Except one part. 
What I want to achieve is that the opacity should have it's custom ease (like for example "linear") . While the rest should be the bounce.in animation. 

is it possible to give the opacity it's own easing while on the same timeline?
 

Link to comment
Share on other sites

  • Solution
tl.fromTo(
  ".main-wrapper",
  {
    blur: 20,
  },
  {
    blur: 0,
    duration: 5,
    ease: "bounce.in"
  }
)
.fromTo(
  ".main-wrapper",
  {
    opacity: 0
  },
  {
    opacity: 1,
    duration: 5,
    ease: "linear"
  }, "<"
);

One way is to create a different tween for that. 

  • Like 5
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×