RZephyr07

The company I work for wants to implement a parallax effect into their corporate website. They tasked me with the job of creating a solution, and I had pretty good success basically just dropping in and using the basicScroll.js library. I noticed the performance was pretty good, but not quite as good as our mockup in SquareSpace that uses the same effect. I added translateZ to force rending onto the GPU, but it's still just not quite there, with occasionally jittery animation when rapidly scrolling up and down. One thing I noticed is that basicScroll might be excessively using requestAnimationFrame, whereas other implementations seem to be only onscroll. That's one possibility. Another possibility is that there is a more performant solution, such as with GSAP. I'm not sure though, since 3D transforms should be pretty darn good, based on my research. Can I -- or even, should I -- recreate this using GSAP? I'm not quite sure what an optimal solution would look like from a coding perspective. I'm not exactly advanced or even intermediate with Javascript, so forgive me. I do prefer to use vanilla Javascript when possible, since I am still learning... and it tends to be less bloated.

You are my hero GreenSock. I'll be joining Club GreenSock for sure in due time The motion blur plugin looks too useful for my needs to pass up... plus I'd love to support your continued development of TweenMax

Aww... perhaps I could Paypal you some beer money for your efforts?

Very cool - it does work perfectly. However this is AS2... any possibility you would know the similar procedure for the AS3 version? I might be able to figure it out myself... I'll start picking at the AS3 files right now. EDIT: Yeah guess not. In the AS3 version everything is broken up into little .as files which makes it all the more puzzling. I'm most familiar with having all my actionscript in the main timeline. What is the advantage of breaking up all the actionscript into these separate files?

I saw the starfield demo here and really like the effect. I tried downloading the source and couldn't make much sense of it - being a pretty novice programmer. I'm used to tweening all in one Flash file and it seems the demo breaks up source into several smaller .as files. Again, I'm mostly a designer coming from AS2 and much of this is pretty new territory for me. I'd imagine the code is rather simple for this star warp effect... can anyone give some pointers on how I might accomplish recreating it in TweenMax or TweenLite? Thanks for any pointers in advance

Thanks Greensock, your suggestions worked flawlessly and saved me a lot of headache! It's great to have the creator of TweenMax so involved in his own forum and available to help troubleshoot - even for nooby problems like mine

I have a snowflake masking out a photo that I want to scale and rotate at the same time for our schools upcoming e-holiday card. I'm using AS2 as I'm familiar with it... you can see the work in progress here. The problem I have is that attempting to enlarge and rotate the 6-spoked snowflake at the same time causes it to kind of bounce in and out... it looks funny. I just want it to enlarge as if it were getting closer. Here's the CS3 source if you need to look at the code, which is on the 3rd frame. import com.greensock.*; import com.greensock.easing.*; /////////////////////////////////////Subtitles Handeling///////////////////////////////////// TweenMax.to(sub1, 0, {_alpha:0}); if (_global.subtitles =="on") { TweenMax.to(sub1, 1, {autoAlpha:100}); trace ("Subtitles will be shown."); } else { TweenMax.to(sub1, 0, {autoAlpha:0}); trace ("Subtitles will not be shown."); } photo1.registrationX = 227.1; photo1.registrationY = 340.75; TweenMax.from(photo1, 2, {autoAlpha:-100}); TweenMax.to(photo1, 7, {_width:618.2, _height:927.5, ease:Default (Regular.easeOut)}) TweenMax.to(snowflake1, 5, {repeat:-1, _rotation:360, ease:Linear.easeNone}); TweenMax.to(snowflake1, 6, {bezier:[{_x:453, _y:046}, {_x:480, _y:280}, {_x:700, _y:400}], orientToBezier:false}); var timeline:TimelineMax = new TimelineMax(); timeline.append(TweenMax.to(snowflake1, 7, {_width:1448.4, _height:1448.4}) ); //TweenMax.to(snowflake1, 7, {_width:1010, _height:1010, ease:Default (Regular.easeOut)}) stop(); The code right now is messy with some seemingly odd choices (I plan on migrating this to timelinemax once I get it figured out).