Jump to content
GreenSock

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

Search the Community

Showing results for tags 'immediaterender'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests

Found 9 results

  1. Note: This page was created for GSAP version 2. We have since released GSAP 3 with many improvements. While it is backward compatible with most GSAP 2 features, some parts may need to be updated to work properly. Please see the GSAP 3 release notes for details. The immediateRender property of from()-based tweens is one of those things you only find out about when it gives you unexpected results. The one case where it is important to change the default behavior is when you have multiple from()-based* tweens on the same property of the same object. The video below explains in detail. In the demo below set var immediateRender:true to see the difference. See the Pen immediateRender by GreenSock (@GreenSock) on CodePen. *from()-based tweens includes: from(), fromTo(), staggerFrom() and staggerFromTo() in TweenLite, TweenMax, TimelineLite and TimelineMax. The default value for immediateRender is true.
  2. mikel

    ImmediateRender

    Hi, For a recurring animation I wanted to tween a fromTo-Progress and ran into the 'trap' immediateRender. So here's an example: when multiple fromTo () - based tweens are animating the same proprets of the same object. And applied here in a thoroughly funny cartoon for a serious cause: Kind regards Mikel
  3. So I have two timelines: - masterTl - subTl (within masterTl) What i want to achieve: I would like my canvas element to be hidden, and set to visible on start of the animation. What i get: When I set visibility in CSS to hidden, and set it back to visible at the beginning of the timeline...: CSS: canvas { visibility: hidden; } JS: subTl .set(canvas, { visibility: 'visible' }) masterTl.add(subTl); ...it immediately sets visibility: 'visible', when the subTl has no {paused: true} set. If I set {paused: true} on subTl it works, but stays paused (therefore does not set visibility to visible) on masterTl.play(), (which is obvious). I don't know how to get around it. I tried to set {immediateRender: false} in both timelines - no luck. Examples: Here are two examples, one with subTl {paused: true}, and the other one without that setting: Pen with {paused: true} Pen without {paused: true} Help desperately needed
  4. I've come come across a strange behaviour that I would like to understand. It might be bug, but I'm not sure. When setting immediateRender to true I would have guessed that onUpdate would also fire once during that initial render, but it seems to depend on the type of tween involved. .to fires the onUpdate while .from and .fromTo doesn't. Example: var obj1 = {a: 0}; var obj2 = {a: 0}; var obj3 = {a: 0}; // logs "update1" TweenLite.to(obj1, 1, {a: 1, onUpdate: function() { console.log("update1"); }, immediateRender: true, paused: true}); // logs nothing TweenLite.from(obj2, 1, {a: 1, onUpdate: function() { console.log("update2"); }, immediateRender: true, paused: true}); // logs nothing TweenLite.fromTo(obj3, 1, {a: 0}, {a: 1, onUpdate: function() { console.log("update3"); }, immediateRender: true, paused: true});
  5. Hey everyone , I post this not so much as a problem, since the solution is easy, but more as a curiosity and a bit of help to anyone else that may see this nested timeline behavior. I’ve created a master timeline via four nested timelines in functions. The first timeline tween of each nested timeline is a set() call. On the first pass through the master timeline, each nested set() at time zero fires at time zero of the master timeline – not time zero of the local timeline. This is easily corrected by applying immediateRender:false to the set() calls. My guess is that when the master timeline is created, all the set()s at position zero of the nested timelines are fired as they become relative to the master timeline of zero? @ Jack – I won’t even pretend to understand many of the things under the hood, but I was reading this post in which you said: 'That's one of the reasons we have the "set()" convenience method in TimelineLite and TimelineMax - it creates a zero-duration tween but it automatically sets immediateRender:false unless you're inserting it at the current time.' I totally understand that and the first set() of the first nested timeline is essentially at time zero of the master timeline so it should and does fire immediately, but I’m mostly curious about why the repeats of the master timeline all play as one might expect – each nested set() at local time zero wait their turn without having to apply an immediateRender of false. At any rate, this is not too big of a deal and easily solved by explicitly setting the immediate render . As I said, it’s more curiosity and for any future forum searchers with questions about it.
  6. Hi guys, I searched in the DOCs but couldn't find a more detailed explanation of "immediateRender" anywhere. I thought all instances would immediately render based on your tweening sequence? For example in what scenario would an "immediateRender:false" be required? Thanks!
  7. Hi, as you can see in the Codepen example, I'm seeing different behaviors when using fromTo() nested in two timelines. First case (work as expected): var t1 = new TimelineMax({paused: true, repeat: 2}); t1 .to("#redBox", 1.5, {x: 300}) .fromTo("#redBox", 1.5, {y: '+=100'}, {x: '+=250', immediateRender: false}, "+=0.5"); Second case (work as expected only once, then from the second iteration it seems to not reset the "from", ignoring "immediateRender = false" config value). var t2 = new TimelineMax({paused: true, repeat: 2}); t2 .to("#blueBox", 1.5, {x: 300}) .add(new TimelineMax().fromTo("#blueBox", 1.5, {y: '+=100'}, {x: '+=250', immediateRender: false}), "+=0.5"); Is there something wrong in my setup or is it a bug? Thanks in advance.
  8. immediateRender doesn't work on second and further repeat cycles of a timeline. Here's the code: var mainTimeline:TimelineMax = new TimelineMax ({repeat:-1, repeatDelay:0.5}); mainTimeline.from (pic_1, 0.4, {y:"-=63", ease:Back.easeOut}) .from (pic_1, 0.4, {alpha:0, ease:Linear.easeNone}, "-=0.4") .from (pic_2, 0.4, {y:"-=63", ease:Back.easeOut}, "-=0.3") .from (pic_2, 0.4, {alpha:0, ease:Linear.easeNone}, "-=0.4") .from ([pic_1, pic_2], 0.4, {colorMatrixFilter:{colorize:0xffcc00, brightness:2}, ease:Linear.easeNone, immediateRender:false});
  9. Hey Jack, Here's a snippet of my code. It's a set of 3D rotating pages whose rotationX property should be reset to 0 onRepeat. FYI this code is actually in a for..loop - it creates 6 tweens and pushes them into a TimelineMax instance. var tm = TweenMax.fromTo(temp_symbol_JS,10, {immediateRender:true,rotationX:rotationIncrement*i}, {rotationX:(rotationIncrement*i)+360, ease:Linear.easeNone, onStart:initWebKit, onStartParams:["{self}", i], onUpdate:positionPage, onUpdateParams:["{self}"], repeat:-1, onRepeat:resetRotation, onRepeatParams:["{self}"]}); timeline.insert(tm); //later function resetRotation (tween){ console.log("I repeated"); } I need 'immediateRender:true' in order to set the initial rotationX of each page. However I am finding that the onRepeat function is fired 6 times immediately. Is this expected behaviour or have I totally missed something? Cheers, Chris
×