How to Navigate an impress.js Presentation

Updated

Use the spacebar or arrow keys to move through an impress.js presentation, and press P to open the speaker console. Navigation follows the 3D positions of the steps on the canvas, so each key press moves to the next or previous step in the presentation's defined order rather than sliding a fixed page. This applies to the standard impress.js demo and to presentations built with the library that keep its default keyboard setup.

Basic Navigation Controls

The impress.js page states: "Use a spacebar or arrow keys to navigate. Press 'P' to launch speaker console."

Action Key What happens
Next step Spacebar or arrow keys Moves to the next step in the presentation sequence
Previous step Arrow keys (reverse direction) Moves back to the prior step
Speaker console P Launches the speaker console view

The arrow keys cover forward and backward movement; the spacebar advances. The exact direction each arrow produces depends on how the presentation's steps are ordered, because impress.js moves between positioned steps on a canvas rather than through numbered slides.

Why Navigation Feels Different From Slide Decks

impress.js is "a presentation tool inspired by the idea behind prezi.com and based on the power of CSS3 transforms and transitions in modern browsers." Its own page asks whether presentations "shouldn't copy the limits of 'classic' slide decks" and invites you to "visualize your big thoughts and tiny ideas by positioning, rotating and scaling them on an infinite canvas."

That design choice explains the navigation behavior:

  • Steps are positions, not pages. Each step is placed somewhere on an infinite canvas, so moving between steps can involve panning, rotating, and zooming rather than a flat left-to-right transition.
  • The sequence is authored, not implicit. The order you move through is the order the presentation defines, not the visual layout order on screen.
  • The canvas is 3D. The page notes "it's in 3D," which is why transitions can include depth and perspective changes.

A practical example: a presentation might place an overview step in the center, a detail step zoomed in to the upper left, and a summary step rotated to the right. Pressing the spacebar walks through those positions in the authored order, and the camera flies between them.

Before You Present: Check Browser Support

The impress.js page opens with a fallback message: "Your browser doesn't support the features required by impress.js, so you are presented with a simplified version of this presentation. For the best experience please use the latest Chrome, Safari or Firefox browser."

If navigation keys do nothing or transitions look flat, you are likely seeing that simplified fallback. Switch to a current version of Chrome, Safari, or Firefox before relying on keyboard navigation or the speaker console.

Common Snags

  • Keys seem unresponsive: Confirm the presentation window has focus, and confirm you are not in the simplified fallback mode described above.
  • You land somewhere unexpected: Remember that steps follow the presentation's authored order, which may not match the visual arrangement on the canvas.
  • Speaker console does not appear: The P shortcut is documented for the standard presentation; if it does not respond, check that the page has focus and that you are in a supported browser.

For the authoritative behavior, the impress.js page itself recommends: "use the source" — the library's source and documentation define how a given presentation's steps and controls are configured.