Share Posted May 31, 2016 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 comment Share on other sites More sharing options...
Share Posted May 31, 2016 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 2 Link to comment Share on other sites More sharing options...
Author Share Posted May 31, 2016 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 comment Share on other sites More sharing options...
Author Share Posted May 31, 2016 Oh wait, I got it, I changed var last to 0. 1 Link to comment Share on other sites More sharing options...
Share Posted May 31, 2016 Just offset the index... See the Pen OXPWJp?editors=0010 by osublake (@osublake) on CodePen Link to comment Share on other sites More sharing options...
Share Posted June 1, 2016 Clever setup, Blake. Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now