Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<h1>Reset</h1> <p>If you just want to return to the initial state (no slides opened), just add the following:</p> <pre><code>$('button.close').click(function() { $('.opened').removeClass('opened'); }); </code></pre> <p>Tracking a full history is overkill in this case.</p> <p>Demo: <a href="http://jsfiddle.net/VA5Pv/4/" rel="nofollow">http://jsfiddle.net/VA5Pv/4/</a></p> <h1>History</h1> <p>Several answers suggested using a history. Most of them used an array which keeps track of the slides the user opened and then simply pop from that to "go back".</p> <pre><code>var history = []; $('#content div').click(function() { var move = $(this).attr('data-move'); history.push(move); SlideOut(); }); $('button.close').click(function() { history.pop(); SlideOut(); }); function SlideOut() { var element = history[history.length - 1]; // ... same as before ... } </code></pre> <p>This would be necessary if you wanted to allow the user to open any number of slides in any order and always present them with a button to go back to the previously opened slide.</p> <h1>Sequence</h1> <p>Another solution could have been to store all the slide IDs in an array and keep a counter that tells you at which slide you are. Going back would mean decrementing the counter if it is not already at zero and then switching to that particular slide.</p> <p>This would be useful if you were trying to create something like a presentation where each slide is opened in sequence and the transitions are entirely linear.</p> <hr> <p>This is why I asked you to clarify what you were trying to build. Depending on the use case, the solutions could have been vastly different and far more complex than what you were actually looking for.</p> <p>Thanks for accepting my answer and welcome to StackOverflow. Feel free to upvote any answers you found helpful even if they did not answer your question sufficiently.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload