Search the Community

Please note that I'm heavily editing my pen, so I just put some code below too. Sorry if this is a silly question, but is my assumption in the comments below correct? That I can set ```transformOrigin``` in the constructor as a default fallback property? Yes, I realize that it would be the normal way, but don't have time to set up a test and I'm being lazy hehe function targetReady() { var tl = new TimelineMax(); //If I pass a property to constructor like this origin: //var tl = new TimelineMax({transformOrigin: "center center"}); //Is my assumption correct that this will be an overridable default fallback, such that any .to, .from, etc., that supplies it's own will take precedent? Also, if it supplied a svgOrigin property...would that take precedence over transformOrigin set in the constructor? //Trying to "DRY up" this sort of redundant setting of transform origin: tl.addLabel('targetReady') .from(finger, .7, {opacity: 0, x: -400, ease: Linear.easeNone}, "targetReady-=.5") .from(circleStroke, .7, {opacity: 0, x: 400, ease: Linear.easeNone}, "targetReady-=.5") .to(finger, .1, {scale: .99, transformOrigin: "center center", ease: Linear.easeNone}, "targetReady+=.7") .to(circleStroke, .1, {scale: .98, y:1, transformOrigin: "center center", ease: Linear.easeNone}, "targetReady+=.7") .to(finger, .1, {scale: 1, transformOrigin: "center center", ease: Linear.easeNone}, "targetReady+=.85") .to(circleStroke, .1, {scale: 1, y: 0, transformOrigin: "center center", ease: Linear.easeNone}, "targetReady+=.85") .from(glass, 2, {opacity: 0, transformOrigin: "center center", ease: Linear.easeNone}, "targetReady+=2") .to(circle, 1, {scale: 30, opacity: 0, transformOrigin: "center center", ease: Linear.easeNone}, "targetReady+=1") .set(circle, {scale: 0, opacity:0, transformOrigin: "center center", ease: Linear.easeNone}, "targetReady+=2.2") .to(circle, .5, {scale: 1, opacity: .4, transformOrigin: "center center", ease: Power2.easeOut}, "targetReady+=2.4") .to(uxTest, 2, {opacity: 0, scale: 0, svgOrigin: "center center", ease: Linear.easeNone}, "targetReady+=3") .from(checkmark, 2.5, {opacity: 0, scale: 0, transformOrigin: "center center", ease: Back.easeOut.config(1.7)}, "targetReady+=4.5") return tl; }

I know this might sound like a dumb question but is there an alternative to calling TimelineLite or TimelineMax without the constructor method. Some of our clients have strict vendors that serve their advertisements and won't allow constructor methods. So this essentially means we can't use GSAP because to invoke it means using var tl = new TimelineLite( ); and for whatever reason these systems don't like it. Any suggestions perhaps using Object.create( ) ? It's not a huge deal if there isn't an alternative but I prefer to use GSAP it makes banner development a breeze and we aren't allowed to use jQuery either so GSAP is the perfect solution. Thank you