follow up question on issue #68, getting TweenMax.staggerFrom to work. #153

aballoonflies opened this Issue Feb 17, 2014 · 1 comment


None yet
2 participants

I got part of solution from #68

I have 5 svgs that needed to be animated one after another. Toptree being the first to animate when scroll into position. Svg are layout horizontally, other than Toptree, all other animation triggers with delay after Toptree is shown, not dependent to scroll.

Current code:
var controller = $.superscrollorama();
// categories panel fade in sequence//
var staggerTween = new TimelineMax();
var Toptree = document.getElementById("Toptree");
var Secondlayer = document.getElementById("Secondlayer");
var Thirdlayer = document.getElementById("Thirdlayer");
var Fourthlayer = document.getElementById("Fourthlayer");
var highlight = document.getElementById("highlight");
var catelayers=[Toptree, Secondlayer, Thirdlayer, Fourthlayer, highlight];

        staggerTween.append(TweenMax.staggerFrom(catelayers, 1, {css:{opacity: 0}}, 0.25),0.5,0);

        controller.addTween(catelayers, staggerTween);
        controller.addTween(Toptree, TweenMax.from(Toptree, 0.5, {css:{opacity: 0}, ease:Quad.easeInOut},0.1),0.5,0);

I received two "Uncaught TypeError: Object [object Array] has no method 'offset' ".

How can I fix it?


janpaepke commented Feb 17, 2014


The first parameter for "addTween is always the trigger.
catelayers is an array and thus doesn't work as a trigger.
Try controller.addTween(Toptree, staggerTween); instead.


@janpaepke janpaepke added the question label Feb 17, 2014

@janpaepke janpaepke self-assigned this Feb 17, 2014

@janpaepke janpaepke closed this Feb 17, 2014

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment