FAKS

Hi everyone, I wanted to reply this post -> http://greensock.com/css-performance But I don't know why I can't leave a message, even if I'm logged in... So I'll share my opinion here I'm working on a game webapp (HTML5/CSS/JS), running on desktop browsers, smartphone, tablet and also into a native IOS app (webview) built with Cordova. In this webapp, like in every games, there is of course transitions between pages, popup and dialog apparition, drag and drop functions, etc... there is also transitions/animations on elements such as div, svg, png from the DOM during the game. During my development process, I was looking for the best way to animate those elements to get the best visual effect during transitions, tween, bouncing effect, apparition effect, etc. I was focusing on this idea "the user should NOT see the difference between my webapp and a real native app". I wanted every transitions/animations look smooth and great. I know GSAP since 2010 so this was my first idea. GSAP is really the most convenient JS library that I know to animate. I have nothing to say on that point. But, during my test on different devices, I noticed that large transitions such as fade on the entire screen, dialog and popup bouncing, opacity apparition was laggy on smartphone and tablet (on desktop browser it was great). So I did some research and test. After reading lot of post about CSS vs JS I tried by myself to recode all those laggy transitions only with CSS rules. The result was surprising because those new transitions was great, no lag, very fluid, better than with GSAP. Then I found this article -> http://greensock.com/css-performance I tried the CodePen linked -> http://codepen.io/GreenSock/full/2a53bbbcd47df627f25ed1b74beb407d/ On my laptop I can't see any difference (I'm not talking about pure performance and FPS benchmark, I'm only talking about visual feeling, looking for something fluid, without lag). But did you try this CodePen on tablet and smartphone? The difference is huge. CSS transitions look really better, fluid without any lag during transition. I did test on iPad Pro, iPad Air, iPad 3, iPhone 5, iPhone 6... Each times I set the Quantity at 2000 and I can see a huge difference. CSS looks much better. Of course coding complex animation with pure CSS rules is awful, so if I could get the same result with GSAP I'll use it for sure. And you guys? Did you encountered the same issue with smartphone and tablet? Any opinion or comment are welcome! Thanks!

Nice! Thank you Jack, you and your team did an amazing work Bravo!

Thank you Jonathan. You right, I tried, your solution could do the trick If there is no other way to check the state of a draggable div, I will do like this. Have a good day!

Hello, I am using your amazing Draggable classes to drag and drop divs and I'm looking for a way to detect if a draggable object is enabled or not... This is my list of draggables divs: var DraggableList = Draggable.create(myDivsArray, { type:"xy"}); After some user actions, I need to disable divs, so I use: DraggableList[divIndex].disable(); But how can I check if a div is enabled or not? // Something like that for example: if(DraggableList[divIndex].enabled){ // this div is enabled for the drag... }else{ // this div is NOT enabled for the drag... } I checked the Draggable object and I didn't se any "enabled" properties... Do you know if there is way to check the state of a Draggable div? If there isn't, it could be great to add this feature to the Draggable object. Thanks!

Thanks for your answer Carl. I will do it like you said.

Hello, I created a FLA file few years ago using your v11 release. Last week I downloaded your v12 release and started new projects. But I got a problem when I reopened and reexported my old FLA file (built with v11). Some stuff are broken during the animation, maybe because of the "overwrite:" parameter set to "true" or "false" but I'm not sure... So I need : - to use the v11 release for my old project (because I can't fix all bugs in it). - to use the v12 release for my new project. In all my FLA files (old and new), I import your greensock classes from a unique folder "AS3-classes". So I never put the "com/greensock/" folder to the root of my swf. My question is : How can I import the v11 for my old project and the v12 for my new project ? Is it possible for those folders to cohabitate ? Thanks a lot for your help.

Thank you Jack, You are right, it's exactly what it's supposed to do Of course, I thought about your solution and for this particular case I can do it this way. But I would find another system because since I use your tweenMax Classes I took the habits to use a lot of delayedCall for big animations with lot of tweenMax... For example, imagine I have to play a sound at 3 seconds inside my timeline. So I need to call a function at 3 seconds. If I set the start time of my timeline a 5, does the sound will be played immediately? Which code would you use for this case? PS : thanks for the V12 trick, I will switch!

Hello, I'm using the TimelineMax ans it works great. But I have a problem with something. I want to use a delayedCall function. In this function, I have other tweenMax. Something like this : var tl:TimelineMax = new TimelineMax(); tl.insert(TweenMax.to(camion, 8,{x:700, ease:Linear.easeNone})); tl.insert(TweenMax.to(nuage, 20,{x:"-100", ease:Linear.easeNone})); tl.insert(TweenMax.delayedCall(3,enleverTexte)); // function enleverTexte() { TweenMax.to(txt1, 0.7,{y:"-40", alpha:0, ease:Quint.easeIn}); TweenMax.to(txt2, 0.7,{y:"-40", alpha:0, ease:Quint.easeIn, delay:0.2}); } Now, I want to start my animation with a gap starting. Like this : tl.currentTime = 5; Normaly, I should not see the movieClip txt1 ans txt2 when my animation start (because I launch the animation at 5 seconds, and inside my timeline I hide the mc txt1 and txt2 at 3 seconds). But it doesn't works... When the animation start, even if I start at 15 seconds, I see the mc txt1 and txt2 and the function enleverTexte() is executed... How can I do this kind of manipulation ? Thank you.

Hello, I have a problem with TweenMax.killAll(). I have 2 swf. swf_parent and swf_child. I load swf_child in swf_parent. I have a function in my swf_child killing all tweens (delayed, tweens, etc). It works great. But the problem is that kill also the tweens of the swf_parent. And I don't want to do that. Can I launch a function in my swf_child killing only his own tweens but not the tweens of his parent ? Thank you !