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.

Background image demo


A common way to create impress.js presentations: Put a large image in the background, then position slides on top of it.

Background image could be a map, or just some picture related to the topic.

It looks like the presentation is flying or traveling above the background image.

I've used this technique a lot: Oscon presentation, HighLoad "cloud" presentation


2 ways to do it:

<div class="step skip" data-scale="15">

For added effect, also set:



2. Large width & height, no scaling

<div class="step skip" data-scale="1">
    <img src="molumen-world-map.svg"
         style="z-index: -1; width: 9000px;" />

So is it better?