cwiens

https://greensock.com/docs/v3/GSAP The video here about half way through has some audio overlapping.

I was thinking that too. Thanks for jumping in with your expertise!

Found the solution. Not completely sure why putting it in a function solved it but this created zero errors. var item = $('[aria-label="myElement"] svg') go(); function go() { TweenLite.to(item, 1, {left:"63px"}); }

I was just trying to un-minify the app.min.js file to see where the heck that error is pointing to. It is hard to get through to someone technical enough on the Storyline end to understand questions like that.

Storyline does not give me any control over publishing min files.

I took that out and it no longer throws the above error. Still the push errors though.

Sorry about that. Put the wrong link. This is pointing to an uncompressed TweenMax.js file. https://360.articulate.com/review/content/2c72465e-38f4-44ec-9b5a-e0295c4a6601/review

It works well so I am tempted to just ignore the error. I use GreenSock outside of Storyline all the time and would love to get it working in our eLearning authoring tool, Storyline. The animation tools are weak in Storyline.

Here is the most simplified I can get it. There are just two triggers (storyline coding) that first load the CDN and then tween the box on the stage. You can see for all 3 tweens it throws the PUSH error. https://360.articulate.com/review/content/e71d0732-f5d1-4f16-817f-c7c3a2c5be3d/review var bx = $('[aria-label="box01"] svg') TweenMax.set(bx, {transformPerspective:450}); TweenMax.to(bx, 4, {alpha:1, scale:.8, rotationY:45, ease:Back.easeOut}); TweenMax.to(bx, 4, {delay:4, scale:1, rotationY:-45, ease:Back.easeOut}); TweenMax.to(bx, 4, {delay:4, scale:5, rotationY:0, ease:Back.easeOut});

Thanks for the reply. Yes, I agree, Storyline is making it difficult for sure. Since it is a push error I was wondering if Greensock was tripping on the [] in the variable definition. I will try to strip it down further and point to the uncompressed TweenMax.

Sorry I am not able to create a CodePen for this because it is happening in storyline. I figured out how to use Greensock directly in Storyline by using this code to get the object name using Jquery. var SL1_01 = $('[aria-label="leftIntro"] svg') TweenMax.set(SL1_01, {transformPerspective:450}); TweenMax.to(SL1_01, 4, {alpha:1, scale:.8, rotationY:45, ease:Back.easeOut}); Here is an example in Articulate Review, after you click start the left stripes rotate. https://360.articulate.com/review/content/28f18475-4a3c-4eef-ba4e-37546b6d5c20/review For every tween it throws an error, but still works perfectly. Uncaught TypeError: Cannot read property 'push' of undefined at g.l.render (TweenMax.min.js:14) at Object.o.render (app.min.js:3) at Object._._updateRoot (app.min.js:3) at Object.o.dispatchEvent (app.min.js:3) at e (app.min.js:3) Is it because of the brackets? It does not work without them. The only way to target objects in Storyline is to use the Accessibility feature and name object and include the svg statement at the end. Again this works great but throws the above error with every object we tween. I would love to just ignore the error but would rather solve it :). Thanks for

me too. Great solve. Tried so many other things and I kept getting some larger jpg's loading while the animation had already started. I am using jquery which normally resolves this but I think the extra large jpgs were loading but not fully rendering. Not sure but this approach seems to have fixed it.

Figured it out. It was a scoping issue. I added window. to make the function global and it works. window.pauseTL = function () { tl.pause(); }

My problem is I can not control TweenMax from outside of the Adobe Animate HTML structure. It throws all my GSAP code into an external JS file but then wraps it up in a closed function and it becomes a scoping issue that is hard to resolve. I am going to just hand code for now.