This is very similar to what I'm looking for - basically I want to build a roll over state that scales up a div. Then play a looping animation, then on roll out reverse the whole thing without playing all of the loops again. I did something similar to the approach below. The problem is that when I play reverse, it's going through all of the loops again where I just want it to go back to the first state. Is this possible?
var timeline1 = new new TimelineMax();
var timeline2 = new new TimelineMax({repeat: -1});
timeline2.add(TweenLite.to('#smallerDiv', .5, {left: 20});
timeline2.add(TweenLite.to('#smallerDiv', .5, {left: 0});
timeline1.add(TweenLite.to('#div', .5, {scaleX:1.5,scaleY:1.5});
timeline1.add(timeline2);
timeline1.add(TweenLite.to('#div', .5, {scaleX:1.0,scaleY:1.0});