Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Casey

Immediate application of TimelineLite.staggerFromTo properties?

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

Getting started with the JS version of the platform, good stuff! Is there a way or recommended technique for applying css settings immediately when using staggering?

 

I have some elements that need to be hidden until they're animated in with staggering and I'd rather not clutter the css with opacity, etc just for tweens' sake...

 

I wrote a timeline/transition plugin for jQuery a while back and added added a special property of "applyProperties:true" to the vars object in the case of a "from" tween... so if there were delays or whatever it would prep things...

 

Thanks!

Link to comment
Share on other sites

Ah, looks like immediateRender:true does the trick nicely. Woot.

Link to comment
Share on other sites

Hi Casey and Welcome to the GreenSock forums!

 

It sounds like you are referring to the immediateRender property.

 

immediateRender : Boolean - Normally when you create a tween, it begins rendering on the very next frame (update cycle) unless you specify a delay. However, if you prefer to force the tween to render immediately when it is created, setimmediateRender to true. Or to prevent a from() from rendering immediately, set immediateRender to false. By default, from() tweens set immediateRender to true.

 

tl.staggerFromTo(element, 1, {css:{alpha:0}}, {css: {alpha:1}, immediateRender: true} )

 

note immediateRender goes inside the "to" vars but outside the css object.

 

here's a live demo: http://jsfiddle.net/...bassador/p7aVP/

 

-Carl

 

btw. thanks again for helping with the downloads issue ;)

Link to comment
Share on other sites

Hah! Thanks Carl, I actually put in in the from object and it worked out wonderfully. Appreciate the reply.

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.
×