cezaleo

Rodrigo, Sorry for the delay. Thanks for this, pretty awesome! I'll try to implement, and show you how it worked out once this project goes live!

I have a question regarding this topic. What if I had a codepen pretty similar to this, except with more labels: http://codepen.io/ccelestine/pen/NqJQaX?editors=001 Is it possible to tweenFromTo("STEP 1", "STEP3") , but skip STEP2?

Adjusted the css and now it's back to working.

If you view the codepen, I'm seeing completely different behavior across chrome and firefox. Specifically in chrome, the last portion of the image is coming in all out of wack. But in firefox it's better. Is there something I could do myself to avoid this?

Based on your example, and what I think you're trying to do, I would change the scale on your doIt3, and doIt4 functions to this function doIt3() { init(); centerX = (useCenter ? (containerW - blocW * scale/2) / 2 : 0); centerY = (useCenter ? (containerH - blocH * scale/2) / 2 : 0); TweenLite.to(bloc, 1, {rotation:0, x:centerX, y:centerY, scale:scale, transformOrigin:"50% 50%", onComplete:function() {logResult()}}); } Hopefully that helps you get closer to what you're trying to do.

I wouldn't say there's a bug, but if you want to make this behave more uniformly, I would adjust this: transformOrigin: "right center", to transformOrigin: "center center", I'm not sure why it's happening that way.

I run into this problem with every site I build. You have the dilemma of how awesome gsap is and then the fact that 10% of the US still uses IE8. So you have to degrade gracefully... I always build a super wizbang version of my animations with rotations and opacity, just to run in to the black line of death on all my pngs that are whizzing around the dom in IE8. In my javascript I use an if else like this: if (!!document.createElement('canvas').getContext && !!document.createElement('canvas').getContext('2d')) { //TIMELINES FOR MODERN BROWSERS else{ //TIMELINES FOR IE 8 } Then I use some scaled back version of my animations, or sometimes just dont provide an animation at all for ie8. It's a trade off you have to learn to live with until this browser eventually dies off... Hopefully this will get you over the hump.

Hello bfred, You could replace this line: main.add(timelineB(),'labelFromTimelineA'); With: main.add(timelineB(),'labelFromTimelineA-=1'); You can also use console.log(tl._totalDuration) to figure at which point in the time you should add your B animation

Fun image slider. http://codepen.io/ccelestine/pen/Cjukm Enjoy.

Hey could you provide a codepen? I'd like to see how this turned out.

Would it be possible to edit the png and put them all on one row?

something like this? http://codepen.io/ccelestine/pen/wdfEt

@jamiejefferson Your swinging sign script is pretty awesome, I've forked it more than a few times playing with ideas. You know that springy thing on the back of the door: http://codepen.io/ccelestine/pen/dtKJA

So, I was playing around with the splitText demo, and was wondering how or if I could animate individual letters as someone types them into an input box. This is really a crappy codepen, but you should be able to see the direction i'm trying to go in. http://codepen.io/ccelestine/pen/CdieB It's sort of working the way I want, but the whole word is animating. Do you think this would be possible with a bit more work? Thanks, C

I was playing around with a pen that animates old school 8bit sprites. Like your typical little italian guy's walk cycle. http://codepen.io/ccelestine/pen/wdfEt