2016-05-03 21 views
0

Ich arbeite an einem Banner mit TweenMax, ich möchte 5 Divs Formular von rechts nach links scrollen und 3 auf einmal anzeigen (außer rechts am Anfang und direkt am Ende). Es ist schwer zu erklären, ohne auf das Ergebnis zu schauen. Sie werden sehen, dass momentan nur 2 Divs gleichzeitig angezeigt werden.greensock tweenmax animation

Please see my codepen

 doAnim = function() {   
     var TL1 = new TimelineMax({repeat:0, repeatDelay:2.5}); 
     TL1.set("#banner", {visibility:"visible"}) 
     .from('#one', 0.9, {left: 300, scale: 0.6, ease: Power0.easeInOut}) 
     .to('#one', 0.9, {left: -200, scale: 0.6, ease: Power0.easeInOut},'+=.1') 
     .from('#two', 0.9, {left: 300, scale: 0.6, ease: Power0.easeInOut},'-=1.5') 
     .to('#two', 0.9, {left: -200, scale: 0.6, ease: Power0.easeInOut},'+=.1') 
     .from('#three', 0.9, {left: 300, scale: 0.6, ease: Power0.easeInOut},'-=1.5') 
     .to('#three', 0.9, {left: -200, scale: 0.6, ease: Power0.easeInOut},'+=.1') 
     .from('#four', 0.9, {left: 300, scale: 0.6, ease: Power0.easeInOut},'-=1.5') 
     .to('#four', 0.9, {left: -200, scale: 0.6, ease: Power0.easeInOut},'+=.1') 
     .from('#five', 0.9, {left: 400, scale: 0.6, ease: Power0.easeInOut},'-=1.5') 
     .to('#five', 0.9, {left: -200, scale: 0.6, ease: Power0.easeInOut},'+=.1'); 
    }; 

Antwort

0

einzige Weg, dies zu erreichen, ist relativ Timing jedes Timeline Schritt zu ändern. Versuchen Sie, '+=.1' zu '0' und '-=1.5' zu '-=1.8' zu ersetzen.