Hi there,
I just can't figue out what I am doing wrong here. I have a paragraph that i need different lines to fade in at different times. I don't know why I can't figrue out what I am doing wrong here. Hopefully someone can help[ me?
One these i am using SuperScrolllarama, the first part of my Tween animation works perfectly I wipe the pages easily.
But I also hava a word heavy paragraph, and i need the lines to fade in separately. i have managed to
break the whole thing when i try to run in my browers.
var pinDur = 1000;
// create animation timeline for pinned element
var pinAnimations = new TimelineLite();
pinAnimations.append([TweenMax.to($('#green'), .5, {css:{top:0}})], .5);
pinAnimations.append([TweenMax.to($('#intromovie'), .5, {css:{top:0}})], .5 );
pinAnimations.append([TweenMax.to($('#red'), .5, {css:{top:0}})], .5);
pinAnimations.append([TweenMax.to($('#blue'), .5, {css:{top:0}})], .5);
pinAnimations.append([TweenMax.to($('#movie1'), .5, {css:{top:0}})], .5);
pinAnimations.append([TweenMax.to($('#history1'), .5, {css:{top:0}})], .5);
pinAnimations.append([TweenMax.to($('#timeline'), .5, {css:{top:0}})], .5);
pinAnimations.append([TweenMax.to($('#next'), .5, {css:{top:0}})], .5);
//pinAnimations.append(TweenMax.to($('#pin-frame-unpin'), .5, {css:{top:'100px'}}));
*************THE ABOVE LOOK FINE****
MY PROBLEMS ARE BELOW*****
var controller = $.superscrollorama();
controller.addTween('#line1', TweenMax.from($('#line1'), .2, {css:{opacity:0}}))
controller.addTween('#line2', TweenMax.from($('#line2'), .5, {css:{opacity:0}}))
controller.addTween('#line3', TweenMax.from($('#line3'), .7, {css:{opacity:0}}))
controller.addTween('#line4', TweenMax.from($('#line4'), .9, {css:{opacity:0}}));