MT

Thank you Jack! I confirm that It works. Thank you for the amazing work you and your team do!

I am using this line of code to capture my version of TweenMax ( in case other plugins load their own version ) wpmc.greensock = {}; window.GreenSockGlobals = {}; window._gsQueue = window._gsDefine = null; If I comment "window.GreenSockGlobals = {};" the error goes away. Can you advise how should I do to store my own version of TweenMax ? Do I need the line in order to capture my own version of TweenMax? Thank you!

Can I set a TweenMax global setting to always parseTransform? I see that I need to learn to always use: TweenMax.fromTo.

Ok. So parseTransform is inside the css:{ scale: 1, parseTransform: true } and it works.

Hi Jack, Please don't take what I am saying the wrong way: Sometimes people forget to always read the new improvements! So if you are caching the values you should have a fail safe. How should I know that I need to set: 'parseTransform'? I don't know when this property was introduced but some of us are so old here that, I for one, forget to read all of your features. If one catches my eye and I need it I am reading about it. Setting 'parseTransform' is a first for me. I knew that I can scale and I tried to do that. I set the TweenMax.to( _blue, .6,{ css:{ scale: 1 }, parseTransform: true, ease:Quad.easeOut } ); and still doesn't work!

I can't give you a codepen. I am just loading one file containing min.js of your package. If i replace ColorPropsPlugin(1.5.0) and put the old 1.3.0 the error doesn't show. This is what Chrome says about the Same Error: Uncaught TypeError: Cannot read property 'defaultStringFilter' of undefined at Array.<anonymous> (wpmc_greensock.js:46)

TweenMax.to is broken! If I use TweenMax.fromTo( _blue, .3, { opacity: 1 }, { opacity: 1, ease:Quad.easeOut } ); TweenMax.fromTo( _blue, .6, { scale: 1.2 }, { scale: 1, ease:Quad.easeOut } ); It works! Why doesn't TweenMax.to work ?

The animation works only once! After that only the opacity works!

No, I want the opacity to have a different animation duration. Opacity a duration of 0.3 and Scale a duration of 0.6 When animating separately the scaling fails! I am supposed to animate an element different ways no ?

I have send you a PM with a link to the entire file that I load. Tell me if you can load the file without getting any error.

I have wasted hours trying to figure out why my animations don't work: This is a little bit frustrating. Find a simple example. http://codepen.io/anon/pen/xgdejr Thank you!

Hi, I am combining multiple files into one. The order is: 1)ScrollTo 2)DrawSVG 3)ColorPropsPlugin(1.5.0) 4)TweenMax I have just updated from 1.17.1 to 1.19.1 The ColorPropsPlugin throws an error: TypeError: i is undefined - on column 3096 If I am using ColorPropsPlugin(1.3.0) It works. Thank you!

Hi Carl, Yes I've tried animating when having different amount of colors and saw that is not working. I will use CSS after and before then with opacity. When you guys will have the time and find a clean solution send an email. Thank you to all of you for the great job you are doing. MT

Hi, I've read a thread regarding animating linear-gradients but i don't understand how can I animate more than 2 colors in a linear-gradient. Example: The CSS would be: Out state: linear-gradient(to top, #2f2f2f 0%, rgba(255, 255, 255, 0) 100%) Over state: linear-gradient(to top, #d92255 0%, #b753f3 50%, #7180ac 100%) As you can see on over I use 3 colors. As per an example I saw http://codepen.io/jonathan/pen/vJwzD there you define top and bottom colors. Isn't there a way to animate the direct css like we do on a simple CSS property. For example: TweenMax.to( obj, .3, { css: { background: "linear-gradient(to top, #d92255 0%, #b753f3 50%, #7180ac 100%)" } } ); If i use the code above, there is no animation, only the change of the background like a normal CSS class. Thank you!

So basically I reversed the ease on the timeline? Linear just multiplies by 1 and leaves each ease on out/in to do the job. Anyway this seems to be right and my eyes can't tell the difference. The code does. Thank you Carl and Diaco! PS: Also Thank you Jack! You guys are doing an awesom work

Hi Carl, Well your solution actually is worse on both hover in/out but, and I say but, both finish at the same time: http://codepen.io/anon/pen/BomgNP I really want to use TimelineMax but I am not going to give up on the fluidity that I already have, could you ask Jack to take a look?( or Jack if are reading this could you give a feedback? ) Thank you!

Hi Carl, Just read your answer. I will try to use your code and see if the speed match. Thank you!

Here is a codepen to illustrate the speed issue: http://codepen.io/anon/pen/XmzwgQ Press the Hover in button and after that press the 'hover out' button. See that the blue boxes is finishing last. On 'hover in' they seem to finish at the same time. So I still don't have the same effect as when using TweenMax. Why am I asking this? Well Imagine that on hover I have a few animations( 4 ) and I am using TweenMax. The reason for using TimelineMax is that on hover out I would not like to write those 4 animations in reverse order and also everytime i change the 'hover in' i have to change the 'hover out'. Using TimelineMax should have simplified the changes and also less lines of code. Thank you

Still there is a slight speed on reverse. So from what i understand in using TimelineMax is that on reverse it applies the same Quad.easeOut this results in the difference. Basically to achieve the same effect as when using single TweenMax, I would have to tell TimelineMax to reverse the easing Quad.easeOut on reverse? Correct? If yes, your solution is an answer but still i can see a difference, even though not many people will see it I can say it does scratch my eyes. PS: I am trying to prepare a codepen to illustrate the difference

Hi DIaco, Clearly this is not a good answer: so basically we are doing TweenLite > TimelineMax > TweenMax ???? http://codepen.io/anon/pen/epeobr If you quickly hover the blue boxes you will see it works until the point that it doesn't and you have to go outside the boxes wait for half a second and then it will work. If you hover slowly on each blue box it works, if you hover fast it breaks. Clearly the solution is not good, the question is why TimelineMax distort the tween when it should only interfere with the playing forward and playing backward( reverse) I don't think nesting 3 levels is a solution: TweenLite > TimelineMax > TweenMax Could I get a technical answer on why the TimelineMax breaks the tween on the red boxes ? or has a bigger speed or easing or something else ? Thank you!

Hi Diaco, Your solution doesn't change anything. Different way to write the code. But added it ( blue boxes ) http://codepen.io/anon/pen/EVbJwL Now observe: 1) Hover on the green boxes up and down and observe the animation speed and how all feel like a wave. 2) Hover on red or blue boxes up and down and observe the animation speed. It seems twice as fast and the wave effect isn't present as on the green boxes I clearly see a difference in how the animations look and feel and I am wondering why? Why doesn't TimelineMax play it the same as in normal usage of TweenMax. Thank you!

Hi, Wondering what is wrong with my TimelineMax setup( red boxes ) since it does not animate the hover in/out as the TweenMax does( green boxes ) Thank you!

Hi, I was trying to play with the GSPreloader function but it seems TimelineMax was not working. I have added gs.TimelineMax but i get another error: "uncaught exception: Cannot add [object Object] into the timeline; it is not a tween, timeline, function, or string." http://jsfiddle.net/GRA89/38/ tl = new gs.TimelineMax({repeat:-1, repeatDelay:0.25}); It seems that gs.TimelineMax is working as you can see the animation. But inside the GSPreloader it isn't. MT

Hi, Line 4832: gs = w.com.greensock, http://jsfiddle.net/C3LZa/11/ In the fiddle example because it is using TweenMax.min you are pointed to line 16 column 4799 On localhost i used TweenMax.js Is there a fix for this? Cheers, MT

Hi Guys, While playing i have stumbled upon getting Sine "not defined" http://jsfiddle.net/C3LZa/9/ Any way to fix this? Cheers, MT