prev&next button

[leaopedro]

Hello all!

 

is it possible for someone to show me a prev&next navigation code example using green sock?

 

thank's in advance!

[Carl]

Unfortunately there are lots of ways to use prev and next all depending on what exactly it is you are navigating. 

 

The following example shows how to use a next button to navigate to the next label in a timeline using TimelineMax's getLabelAfter() method:

 

var next = $("#next"),
    tl = new TimelineMax({paused:true});
    
tl.to("#box1", 0.5, {left:400}, "label0")
  .to("#box2", 0.5, {left:400}, "label1") 
  .to("#box3", 0.5, {left:400}, "label2")
  .add("label3");
  
next.click(function() {
  var nextLabel = tl.getLabelAfter();
  if (nextLabel){
     tl.tweenTo(nextLabel);
  }else{
    //oops! no more labels
    //go to beginning of timeline and the tweenTo next label
     tl.time(0).tweenTo(tl.getLabelAfter());
  }
});

live demo: http://codepen.io/GreenSock/pen/4a6637992d8e2e2d2eefdb916c6ecc04

 

And yes, TimelineMax has a getLabelBefore() method too

 

If you were looking for something else, please fork that codepen demo and provide some code and animation that illustrates your needs.