Jump to content
Search Community

TimelineLite.from() does not work if time is less than 0.0000003

BBaysinger test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I was trying to create a function that was the inverse of TimelineLite.set(), as from() is the inverse of to(). So a set() function that starts the property at the passed value, then swaps back to the initial value. I wrapped TimelineLite from() to achieve this with a time of zero:

 

function unset(selector, props, position) {
    // Does not work.
    new TimelineLite().from(selector, 0, props, position);
};

 

TimelineLite.from() does not work if time is less than 0.0000003.

 

So remedied this with:

 

function unset(selector, props, position) {
    // Does not work if duration < 0.0000003.
    new TimelineMax().from(selector, 0.0000003, props, position);
};

 

Is 0.0000003 some sort of magic number? Is this expected behavior? Is there a function that already does what I want?

 

I was testing in Chrome on OSX.

Link to comment
Share on other sites

I must admit I'm perplexed at why you'd want to do anything like this. A set() immediately sets the value (of course), so unset() would...set it to some other value and then immediately put it back to where it started? What's the point? It's almost like doing this:

element.style.opacity = 1; //start
element.style.opacity = 0; //set
element.style.opacity = 1; //unset - what's the point?

 

Can you provide a practical use case? Perhaps that'll help me wrap my head around a proper solution for you. 

Link to comment
Share on other sites

It doesn't set everything immediately if you pass a position. I need it to have all the same features, onComplete, etc., as a timeline. I didn't have it in there, but the wrapper function will return the timeline instance for inclusion into other timelines, etc...

 

So I just need a timeline that (can) immediately set the 'from' properties and function just like any other timeline.

 

 

Link to comment
Share on other sites

Well, yes, from() tweens have immediateRender:true by default, so they would indeed set things right away even if you pass in a non-zero position. 

 

And is there any reason you're using a timeline rather than a simple TweenLite.from()? Seems unnecessary/unhelpful. 

 

So you're trying to record the current values at that very moment (when you create the animation), and also set them to something else immediately, right? And then you want it to be able to revert them later when playing forward? I'm still really struggling to see a practical use case. I've been doing this for 10+ years and I don't think something like this has ever come up. I suspect that if you explained the "why" behind what you're doing, we may be able to offer you a cleaner solution. Do you have a super simplistic example scenario, perhaps as a codepen that we can peek at? Again, the simpler the better. 

  • Like 2
Link to comment
Share on other sites

Hi @BBaysinger. I'm with @GreenSock in that a simplified Pen may shed some clarity on what you are looking to achieve.

That said, reading between the lines, the FLIP principle that @OSUblake, recently mentioned seems like it may be what you're looking for: 

https://aerotwist.com/blog/flip-your-animations/

 

 

See his CodePen example here:

 

See the Pen NeBpJm by osublake (@osublake) on CodePen

 

  • Like 2
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.
×
×
  • Create New...