Hi,
I'm new to gsap and playing around with grouping animations. I'm struggeling with following:
var mtl = new TimelineLite();
function hufPerspective () {
var sentence = Huf.html().split("");
var tl = new TimelineMax({repeat:1, repeatDelay:2, yoyo:true});
TweenLite.set(Huf, {css:{perspective:500, perspectiveOrigin:"50% 50%", transformStyle:"preserve-3d"}});
Huf.html("");
$.each(sentence, function(index, val) {
if(val === " ") {
val = " ";
}
var letter = $("<span/>", {id : "txt" + index}).html(val).appendTo(Huf);
tl.to(letter, 1, {autoAlpha:1, ease:Back.easeOut, rotationX:360, transformOrigin:"50% 50% -20"}, index * 0.05);
});
return tl;
}
mtl.add(hufPerspective(),1);
mtl.play();
I can't this getting run. If I remove the 'return' the animation plays as expected, but with the retunr nothing happens. What is my mistake?
Thanks. Olaf