friendlygiraffe

Members
  • Content count

    217
  • Joined

  • Last visited

Community Reputation

8 Newbie

About friendlygiraffe

  • Rank
    Advanced Member
  1. Animate width from left to right

    Thanks Mikel, nearly - I need the text be static Here's a better example of what I mean. Have a look at the red version for what I'm trying to achieve (without having to animated the text):
  2. Animate width from left to right

    Thanks Sahil, I couldn't see a solution on that thread that kept the contents (text) static
  3. Animate width from left to right

    I'm trying to animate a div (mask) from left to right using width, keeping the text static. I have tried to achieve this using transformOrigin & marginLeft Any other suggestions welcome Thanks
  4. Transform and z-index stacking context

    It seems to work when specifying #background_exit as z-index:-1; Would be good to find a more flexible fix though
  5. Transform and z-index stacking context

    Thanks, any clue why is the button no longer clickable ?
  6. Transform and z-index stacking context

    Might not be specific to GSAP, but: You'll notice when the button is clicked and the function is fired, it seems to remove it's functionally. See in example Thanks
  7. staggerFrom same Point

    Great, thanks
  8. staggerFrom same Point

    Thanks a lot. @PointC That works, but the circles need to be set as relative, not absolute Is there a way of setting a relative div to an absolute position ?
  9. staggerFrom same Point

    Is it possible to staggerFrom the same point on a relative positioned div? The Circles all start from 200px from their individual positions, whereas I'd prefer them to start at left:200px in absolute coordinates. Thanks
  10. set vs 0 in TimeLines

    immediateRender:false worked a treat. Many thanks!
  11. set vs 0 in TimeLines

    Hi, I wondered why the only way I can trigger a quick reveal in Nested Timelines, is by using a duration longer than 0. As you can see in the CodePen example, the Blue, Green and Yellow circles should reveal themselves halfway through the Red circle's Timeline, but .set and a duration of 0 trigger initially, whereas the only way round it is to use 0.00001
  12. Skip on repeat

    Thanks Jonathan, that's really handy I am actually using it within a nested Sequence, and I noticed the onRepeat method doesn't behave correctly when nested TweenLite.defaultEase = Power0.easeNone; var textAnims = new TimelineMax({ repeat:-1, onRepeat: seek2 }); textAnims.to(".red", 0.5, {x:400, autoAlpha:0.3}) .to(".red", 0.5, {x:0, autoAlpha:1}) .to(".green", 0.5, {x:400, autoAlpha:0.3}) .to(".green", 0.5, {x:0, autoAlpha:1}) .to(".blue", 0.5, {x:400, autoAlpha:0.3}) .to(".blue", 0.5, {x:0, autoAlpha:1}) function seek2(){ textAnims.seek(1.5); } var tl = new TimelineMax(); tl.add(textAnims, 0.0)
  13. Skip on repeat

    Hi, I want a Timeline to skip to half way through on repeat So the first play through starts from 0, but on every play through after that, I want it to start form halfway Is that possible? var tl = new TimelineMax({repeat:-1, repeatDelay:2}); tl.to("#circle", 4, {x:400}) .seek(2)
  14. Repeating fromTo without using Timeline

    That's great to know. Thanks a lot Carl
  15. Repeating fromTo without using Timeline

    Actually, I marked that as solved, but what I really wanted was the repeatDelay to be the duration the object is not visible. Not the duration of the object staying visible. Would I have to use a timeline for that ?