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