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.

Example Presentation

Test

2022

q Any element with the class="notes" will not be displayed. This can be used for speaker notes. In fact, the impressConsole plugin will show it in the speaker console!

Table of Contents

A title slide Table of Contents
Text slide Bullet points
Blockquote & image More basic text styles
Motion effects 101 Add-ons
Add-ons More info

Table of Contents, with links to other slides of this same presentation.

Note that instead of absolute positioning we use relative positioning, with the data-rel-x and data-rel-y attributes. This means the step is positioned relative to the foregoing step. In other words, this is equivalent to data-x="0" data-y="-3000".

A slide with text

This slide has a few paragraphs
(p element) of normal text.

Personally I like centered or even justified text, as it looks less boring. This can of course be set in the css file.

I really like the style on links in these presentations. I modified the border to be beveled, but it's mostly from @bartaz' original demo. @bartaz is the creator of impress.js.

In this slide, we don't even specify the relative position, rather that too is inherited. So this slide will again be 1000px to the right of the previous one.

Bullet points