Jump to content

Diaco last won the day on December 20 2017

Diaco had the most liked content!


  • Posts

  • Joined

  • Last visited

  • Days Won


Everything posted by Diaco

  1. Hi @hanslibuzli Hmm, there's another simpler way; pls check this out : var zoom = 2; TweenMax.to('.outer',1,{scale:zoom,onUpdate:function(){ TweenLite.set('.inner',{z:0.2,scale:1/this.target[0]._gsTransform.scaleX}); } ,repeat:-1,yoyo:true })
  2. Diaco

    Gsap Slinky animation

    Hi @DD77 pls check these out : and the second one: are these what you looking for?
  3. Hi @geddski At first, for the Club GreenSock bonus plugins on Codepen; you can find the codepen safe versions here: https://codepen.io/GreenSock/pen/OPqpRJ And about your issue; pls try to wrap your spacing entities with a span tag. <span>&nbsp;&nbsp;.....</span> Splittext completely respects to <br> tags. btw, you can use "&emsp;" instead of "&nbsp;"
  4. Hi rgfx Your section's width is bigger than its child and content doesn't overflow, try to remove section's width in your CSS or set to smaller value
  5. Hi Rick May pls check this out :
  6. Hi hugonoro pls check this thread : http://greensock.com/forums/topic/15550-draggable-elements-return-to-previous-position/
  7. Hi phidur if I understand correctly what are you trying to achieve, you can simply use draggable trigger property; pls check this out: http://codepen.io/MAW/pen/GNParR
  8. Hi bds glad you find a way, but I think this can help you too: http://codepen.io/MAW/pen/mOaYbY
  9. Hi heldrida pls try this : var myTween = TweenLite.to(elem, 1,{x:100 , paused:true}); // your tween or timeline TweenLite.fromTo(myTween,1,{progress:0.5},{progress:1}) // tween from to target progress TweenLite.fromTo(myTween,1,{time:0.5},{time:1}) // tween from to target time
  10. Hi Guys pls try this : CSSPlugin.cascadeTo(".parent", 1, {className:"+=on", delay:2}); http://codepen.io/MAW/pen/KNrBVb
  11. Diaco

    svg wave

    in addition to Dipscom answer , if I understand correctly ; pls try this : var tl = new TimelineMax({ repeat:-1, yoyo:true, repeatDelay:1 }) .from(["#path1","#path2"], 1, {drawSVG:"0%", ease:Power2.easeInOut}) .to(["#path1","#path2"], 1, {drawSVG:"100% 100%", ease:Power2.easeInOut})
  12. Hi iuscare you just need to set transformOrigin like this : TweenMax.staggerFrom(listItems, .4, {scale:0,transformOrigin:'center'}, 0.3);
  13. nope , it's just an example for store returned tl/tween instead of just playing a timeline/tween on click , for control in future such as reverse , pause , play...etc
  14. Hi pls try like this : function tlGenerator(target){ var tl = new TimelineLite() tl.to( myTarget, 1, {x:300}); return tl; // you can store generated timeline to be controllable like this : var myNewTl = tlGenerator(myTarget); } var myTarget = $(".red"); var redTl = tlGenerator(myTarget); $("#play").click(function(){ myTarget = $(".blue"); tlGenerator(myTarget); redTl.reverse(); }); http://codepen.io/MAW/pen/GNxyWy
  15. Hi hugonoro for getting the last position of the draggable element please try something like this : var lastPos = {x:0,y:0}; Draggable.create( elem , { type: "x,y", onPress:function(){ lastPos.x = this.x; lastPos.y = this.y; console.log(" last position : "+ lastPos.x , lastPos.y); // get Draggable current position }, onDragEnd:function(){ if( your logic ){ TweenLite.to(this.target,1,{ x:lastPos.x , y:lastPos.y }); } } });
  16. Hi, one2gov pls check this out : http://codepen.io/MAW/pen/NbYKKK
  17. Hi qarlo pls try these methods : http://codepen.io/MAW/pen/vydbbB masterTl.seek( childTl.getLabelTime('labe') ); // if childTl added and start from time '0' in master timeline masterTl.seek( childTl.startTime()+childTl.getLabelTime('labe') ); // if childTl position in another time in master Tl
  18. method #2 is what you're looking for , you just need to add a .set() at the beginning . pls check the pen again
  19. Hi, milhouse I don't what's your desired menu behaviour , but I think this pen can help you : http://codepen.io/MAW/pen/zoRmYd
  20. hmm , for now you can easily use onUpdate method : http://greensock.com/forums/topic/14104-combining-the-attr-and-bezier-plugins-for-svg-clip-path-animations/?p=59665 otherwise seems that need BezierPlugin update , btw i will check for if there's a way to embed a Bezier tween in the plugin too , i think possibly there's a way
  21. Hi Guys i've quickly made this little plugin for SVG viewBox , what do you think ( it's still kinda messy and need a bit improvement ) : http://codepen.io/MAW/pen/609130da3c4ffac76bdfc1722e048380
  22. there are many ways with same results , but maybe something like this if(i==$boxes.length-1) tl.vars.onComplete = part2 ; http://codepen.io/MAW/pen/KzoqQy