Hi all,
I am currently working on a onepage parallax wordpress site for a client, he spotted a site that had a load of cool effects and wants them adding to his site. That led me to superscrollorama which led me here.
I am trying to recreate some of the effects from the superscrollarama demo site on the the clients site. I want to be able to use the same effect on numerous classes and have them trigger when they scroll into view and reverse when scrolling out of view (as they do on the demo site). Unfortunately ALL of them trigger at the same time (when the first class comes into view) and they dont reverse out again.
Below is the code from the superscrollarama demo site
// individual element tween examples
controller.addTween('#fade-it', TweenMax.from( $('#fade-it'), .5, {css:{opacity: 0}}));
controller.addTween('#fly-it', TweenMax.from( $('#fly-it'), .25, {css:{right:'1000px'}, ease:Quad.easeInOut}));
controller.addTween('#spin-it', TweenMax.from( $('#spin-it'), .25, {css:{opacity:0, rotation: 720}, ease:Quad.easeOut}));
I am completely new to this, and am at a loss.
Any help/advice would be much appriciated.