Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
ohem

Next / Previous button to control nested timelines

Recommended Posts

Hi, this is probably super obvious, but I was wondering how I might set up a next & previous button, so that when clicked, it would play a next or previous step in a timeline sequence?

 
What I want to do is basically an animated slideshow/presentation.  The first frame/scene (which has it's own timeline) would animate, and when it's over it would pause until someone clicks the "next" button.  If the "previous" button is clicked, I'd like it to replay the previous scene.
 
What I'm stuck on is getting the master timeline to pause between scenes, as well as getting it to replay just the previous scene (and not reverse the entire master timeline).
 
It seems simple but I'm a little stuck.  I put together a simple example on codepen to illustrate what I'm trying to do: 
 
Any insight is much appreciated.

See the Pen wWBoRg by ohem (@ohem) on CodePen

Link to post
Share on other sites

Here's a pattern you could get started with. You really didn't say if you could go back more than one scene, in which case you would need to add a delay to allow time for a response before playing.

See the Pen OXPWJp?editors=0010 by osublake (@osublake) on CodePen

  • Like 2
Link to post
Share on other sites

Here's a pattern you could get started with. You really didn't say if you could go back more than one scene, in which case you would need to add a delay to allow time for a response before playing.

See the Pen OXPWJp?editors=0010 by osublake (@osublake) on CodePen

Thanks!  The next button functionality is perfect, but I would like the previous button to replay the previous scene.  So if you're on "part 2", it would go back to "part 1", or if you're on "part 3" it would replay "part 2" etc.

 

How would I do that?  (Currently the "previous" button is just replaying the current scene.)

Link to post
Share on other sites

Oh wait, I got it, I changed var last to 0.

  • Like 1
Link to post
Share on other sites

Clever setup, Blake.

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

×