Spiv

Hi, I tested this site as well on iPad (gen4). On safari I had troubles getting past the tooltips and it lagged heavily when I managed. Like in section Awareness the video just didn't pop, but I did see the planets coming up in a very stuttering way. From there I was kinda stuck, the brain didn't open and it was even harder to get to another section. On Chrome the animations played almost as smooth as on desktop, only the click as described above was the same. It was hard to get past the tooltips. But apart from the clicks, I could actually use the site, while in safari you just have the impression nothing works. In other words: A huge difference and I'm intrigued as well how there can be such a performance difference between two browsers on the same OS...and even the native one failing badly...

I don't see the issues you described, Paul. Good performance here in firefox, same as in Chrome on macbook. I do have to say it has terrible performance on iOS. It doesn't function at all actually. I have noticed this with the scrollorama demo as well. Completely breaks on iOS. No idea about android. Therefore I tend not to use scrollorama for any websites. Not so sure what the cause is, but my bet it is not GSAP, but the way scrollorama works. It doesn't seem optimized. Skrollr seems much better in terms of performance, which I'll try out soon with GSAP. PS I'm new with GSAP, so for in depth solutions, you'll need to rely on the more skilled users. Just trying to help out with testing. In the meanwhile I also learn towards performance issues and when not to use it

Hi Rhenando, huge thanks already for the help. I'm lacking a bit time this afternoon, but I'll look into it tomorrow.

I just read your post, I'm on a macbook 10.7.5 and use firefox...all went smooth. Maybe it would help to clarify the specific issues?

Hi, based on the example I made yesterday http://forums.greensock.com/topic/7467-reinitiate-a-tween-oncomplete/ I'd like to make this more user interactive. As a starter I would like to make the background move on scrolling (scroll down moves forward, scroll up moves backward). I'm not sure if I need an external plugin for that like eg scrollorama since I work horizontally and don't need a scrollbar. I did the basic move easily with scrollorama, but then i seem to need an infinite going scrollbar controller.pin($('#bg_1'), 3000, { anim: (new TimelineLite()) .append( TweenMax.to($('#bg_1'), .5, {css:{backgroundPosition:-endPosition + "px 0"}, immediateRender:true}) ) }) So how would I make a background infinite moving in the x direction, like in the example above, when using a scrollwheel/touchpad up/down? On the same trigger I would make the ant start/stop its walk cycle. I can't seem to find a way to trigger when a user scrolls (when there are no visible scrollbars). Thanks in advance.

Hi Carl, it works with tween.restart() instead of tween.play(). Actually I also did this now for tween2. Seems restart() is a better option for tween events you want to repeat. Now I'm gonna try making the ant walk by means of scrolling. I guess I'll soon need to start a new topic Thanks a lot!

Hi, As this is my very first post: Awesome work, Greensock. Playing around with GSAP makes the sun shine in me (as an ex flash animator) and I wish I had it discovered earlier. I'm throwing in my first experiment: multiple infinite moving backgrounds at different speed combined with CSS keyframe animation to create cycles. I have a bit of trouble with the following. Please have a look at http://goo.gl/1jCPK My code for the bird: tween = TweenMax.to(bird, 2, {css:{left:"300px", top:"-50px"}, ease:Linear.easeNone}); tween2 = TweenMax.to(bird, 1, {css:{left:"2000px", top:"-300px"}, ease:Linear.easeNone, onComplete:myFunction}); function myFunction() { TweenMax.to(bird, 0, {css:{left:"-300px", top:"-50px"}, ease:Linear.easeNone}); } tween.pause(); tween2.pause(); bringBtn.onclick = function() { tween.play(); } revBtn.onclick = function() { tween.reverse(); } byeBtn.onclick = function() { tween2.play(); } 1. Clicking on the "bye bird" button makes the bird fly away. I can't manage to bring it back by clicking "call bird" button. I guess I do something wrong in the onComplete function? I thought bringing it back to the original position after the tween is finished would suffice? 2. It runs pretty smooth on a dual core laptop, but very choppy on iOS devices (and I suppose android as well). Even the latest quadcore ipad shows it choppy. Any tips to optimize this type of animation? I'm testing how far I can go with this engine. Please note I'm not a great coder, I design and write mainly CSS/HTML and only wade my feet in JS. So I'm all ears to learn and share problems with others here that might have similar issues. Thanks a lot! S