dazzafact

Hey, I just extended the methods in GSAP now.
But is there a better way without touching the raw source?
 
_proto2.getParamBySec = function getParamBySec(begin,params) { var animations = this.getChildren(1, 1, 1), i = animations.length; while (i--) { if (begin>=animations[i]._start ) { if(typeof(animations[i].vars[params])!="undefined"){ return animations[i].vars[params]; } } } return false }; tl.to('.rectangle', { opacity: 1, imageNum:3, slideNum:1, repeat:0, x: '2', scale:1 },'4'); twe=tl.getParamBySec(4,'slideNum')  

hey, this is very cool. i even found a better solution to simulate reverse, using negative delay with yoyo(): delay:-4
That makes the use of reverse() unnecessary
Would be very nice to integrate this as a feature in the next Version of GSAP. For example: "yoyoStartHalf:true" , to simulate a reverse effect.😄
tl.fromTo('.rectangle', {opacity:1,scale:2,rotate:0},{ duration: 4, opacity: 1, delay:-4, yoyo:true, repeat:1, rotate: '-360', scale:0 },'0')
See the Pen MWOMvdX by dazzafact (@dazzafact) on CodePen

Ok, here's my Solution if you use PixiJs

 
$tl =gsap.timeline() $anchorX=0.8 //your x image point to zoom $anchorY=0.2 //your y image point to zoom $pointX=$canvasWidth*$anchorX;//image size width $pointY=$canvasHeight*$anchorY;//image size height            $slides.anchor.set($anchorX,$anchorY);//only for Pixi $tl.fromTo($slides,{x:$pointX,y$pointY},{duration:1},0)//set image position on begin relative to Scale values (.to()) .to($slides,{duration:12, pixi: {scaleX :2,scaleY 2 } },'>')                     

How can i pass variables from a Loop
i expect to access Values param1,param2,param3,etc
But it always gives the last key param13
 
for (i in $slideTextArr){ let y=i; slideAni.eventCallback("onStart", function(t){                 console.log(t) // always last key "param13"             }, ["param"+y]); } UPDATE Solution:
 
for (i in $slideTextArr){ let y=i; slideAni.to(textMesh[i],{ onStart:function(t){ console.log(t) }, onStartParams: ["param"+y] }) }