Ginger Soul

Appreciate the hounding. I think the key was to mention how well Safari and Firefox perform in comparison, so thanks Carl! DB

Thanks to everybody who put these janky demos together and explained the issues that this bug is causing to the Chrome team. I build sites (like this one) with ScrollMagic + GSAP scale tweens, both of which make me look like a champion to my non-techy clients. Smooth scaling is muy importante to me, both in the background (Ken Burns FX, etc) and the foreground (clients want pop; scale pops). This bug came around and screwed that allll up. I've starred the issue and I hope that my clients are using other browsers (or have good graphics cards) until a fix comes though. Blagh, Dave Bloom

Super useful tool, thanks Blake! I used this to create a 'Ken Burns' effect (scaling an absolutely-positioned, 'faux background image' from 1 to 1.5 over the course of about 20 seconds) in a plugin I'm building. Traditional easing functions (like ease-out) accelerated too fast at the start; I needed something that started off 'linear' and slowly eased out so that, at the end of the animation, you didn't notice a jerky stop to the scaling. This made it easy as pie. Much appreciated. Dave Bloom

Has this been documented? What's the utility designed to do, anyways? Just curious Dave Bloom

Very helpful, and thanks for the quick reply. I feel like these properties would be a helpful add-on to the documentation (or, at least, the article I linked). Please consider adding it. Thanks! DB

Hello, I've searched around but I'm not seeing a comprehensive list of how GSAP needs CSS3 properties formatted for tweens. In other words - let's say that I want to move an item 100px on the X axis, like so (unprefixed): transform: translate(100px, 0px); I think the answer is something like transformX:[value] within the context of a tween. But where is this in the documentation? The 'goodies' article states that these transforms are possible, but it doesn't go into much detail about how to implement individual properties. I feel like I'm missing something obvious. In that case, please smack me with the correct answer and I'll go away Thanks DB

Got it, thanks for clarifying! I'll put together a few layouts that employ different techniques and see how that works. Take it easy, Dave

Wow, fantastic response. You really went the extra mile, and I appreciate it. You opened my eyes on this one! I'll see what effect that code has on the build, and yes, I think a CSS animation may be appropriate for these kinds of 'pushing' effects. Glad to know there are such knowledgeable devs here. Looking forward to doing more with this framework. DB

Hello Greensock community, A small question that had me scratching my head late last night. I have a simple mobile slide-out menu on http://swizzy.gingersoulrecords.com/ (below 767 px browser width, trigger is in the upper left). If you use a desktop browser to narrow your browser and trigger the slide-out animation, it's smooth as butter...but on an actual mobile device (iPhone 4 in my case), it gets a little choppy as it has to 'push' the lorem ipsum down as it expands. Interestingly, if I get rid of the text and leave just the menu there, it has nothing to 'push down' by expanding and slides down perfectly with no choppiness. This may be due to my device being slow, but I'm thinking it's because Greensock has to do double duty - animating the transition of the target and then animating the 'push down' of the non-targeted content area. I tried adding the z(0.1) trick to kick for hardware acceleration, but that didn't seem to do much for me. Anyone want to open http://swizzy.gingersoulrecords.com/ on a mobile device and compare the slidedown animation performance with desktop? I may just design around this (I think a fixed, persistent nav is better for mobile anyways), but I imagine that one of my greensock animations will be 'pushing' content in the future, so I'd like some help understanding this. Thank you! Dave Bloom Ginger Soul Records