Getting started with deck.js:
fit extension
use right arrow to move on

“fit”: What It Does

• Before anything

  please resize the slides by dragging the bottom right corner of the dark-red frame
• More on the next slide

Designing for “fit”

• You decide on a design dimension
  (default: 800x600)
• You write all your slides
  as if they were exactly of this size


• You put your slides in a container of any size
• You decide how they should adapt (e.g., center)


• And “fit” handles it!

Playing with “fit” demo

• Resize the red box
• Change the “fitMode”
  with the select on the top-right of this page
• Press the 's' key to make the slides fit to the window

Browser support

• Did it work for you? :)
• Should be ok on good browsers

Notes about the demo

• The 8 yellow boxes are to test background elements. You may use them into your slides, e.g., for footer, logos, …
• The red border just helps understanding where the “deck-container” is
• The white border just helps understanding where each “slide” is
• The white border also illustrates the “fitMarginX” and “fitMarginY” options that can be used for adding a margin around the slides