Hey guys, really impressed with GSAP having a great time building an interactive html5 animation with it.
I've got a weird issue that I'm trying to create in jsfiddle but unfortunately cannot.
The following code:
var getFebruaryTimeline = function(){
var febtimeline = new TimelineMax()
// bring in notice
.from(assets.feb_notice, 1, {rotation:120, transformOrigin:"50% -20%", ease:Back.easeOut})
// bring in woman
.from(assets.feb_woman1, 1, {top:"+=600",rotation:-90, transformOrigin:"50% 100%", ease:Back.easeOut, delay:3}, 'woman')
// bring in man
.from(assets.feb_man1, 0.7, {top:"+=600",rotation:90, transformOrigin:"50% 100%", ease:Back.easeOut}, 'man')
// dance a bit
.to(assets.feb_woman1, 0.5, {top:"+=10", left:"+=10"}, 'man')
.to(assets.feb_man1, 0.5, {top:"+=10", left:"+=10"}, 'dance1')
.to(assets.feb_woman1, 0.5, {top:"-=0", left:"+=10"}, 'dance1')
.to(assets.feb_man1, 0.5, {top:"-=20", left:"-=20"}, 'dance2')
.to(assets.feb_woman1, 0.5, {top:"+=10", left:"-=10"}, 'dance2')
.to(assets.feb_man1, 0.5, {top:"+=10", left:"+=10"}, 'dance3')
// bring in suit
.from(assets.feb_suit, 0.1, {opacity:0, onComplete:function(){
$(assets.feb_man1).attr('src', $(assets.feb_man2).attr('src'));
}}, 'suitswap')
// lose the suit
.to(assets.feb_suit, 1.5, {left:"+=50", top:"+=400", rotation:90, ease:Circ.EaseOut}, 'suitswap+=0.5')
// embarassing
.to(assets.feb_man1, 0.1, {top:"+=1", onComplete:function(){
$(assets.feb_man1).attr('src', $(assets.feb_man3).attr('src'));
$(assets.feb_woman1).attr('src', $(assets.feb_woman2).attr('src'));
}}, 'suitswap+=1.2')
// run away
.to(assets.feb_woman1, 0.5, {left:"+=300"})
.to(assets.feb_man1, 2, {left:"-=650"})
// clear notice
.to(assets.feb_notice, 0.5, {rotation:120, transformOrigin:"50% -20%"})
.call(nextMonth);
return febtimeline;
on the line highlighted with "// bring in man" if the duration value is set to 0.7 then for some reason the .call(nextMonth) never gets executed. If I change this to 0.5 the call is fine!? All the other steps in the sequence run as expected just the call never happens.
I've got numerous similar animations and am experiencing similar fragilities throughout and so wondered if there was some known quirk I might be experiencing? There's quite a lot of other stuff going on (preloading the assets for each timeline before creation) hence the complexity in reproducing.
I'll keep trying to recreate in a simplified jsfiddle but thought I'd post this now in case there's something obvious I'm missing.
Cheers!