Skip to content

Commit

Permalink
Change default target resolution to HD 1920x1080.
Browse files Browse the repository at this point in the history
If you aren't setting target width and height explicitly in the root div,
this change will likely affect the size and layout of your presentation
steps. See DOCUMENTATION.md for details and how to fix.
  • Loading branch information
henrikingo committed May 29, 2022
1 parent 20cd28f commit 78c954a
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 11 deletions.
14 changes: 9 additions & 5 deletions DOCUMENTATION.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,12 @@ You need to use pixel values. The pixel values used here correspond to the `data
given to the `#impress` root element. When the presentation is viewed on a larger or smaller screen, impress.js
will automatically scale the steps to fit the screen.

**NOTE:** I intend to change the defaults to target HD screens in 2021. So you may want to make a habit
of explicitly defining these attributes for now, to avoid any disruption when the defaults change.
**NOTE:** The default width and height have been changed to target HD screens in v1.2.0. If you
don't set target width and height explicitly, layout and dimensions of your presentations are likely
to be affected. In order to get back the old target resolution, use:

<div id="impress" data-width="1024" data-height="768" data-max-scale="1" data-min-scale="0"


You can also control the perspective with `data-perspective="500"` giving it a number of pixels.
It defaults to 1000. You can set it to 0 if you don't want any 3D effects.
Expand All @@ -36,9 +40,9 @@ See also [the plugin README](src/plugins/README.md) for documentation on `data-a
Attribute | Default | Explanation
-------------------------|-----------|------------
data-transition-duration | 1000 (ms) | Speed of transition between steps.
data-width | 1024 (px) | Width of target screen size. When presentation is viewed on a larger or smaller screen, impress.js will scale all content automatically.
data-height | 768 (px) | Height of target screen size.
data-max-scale | 1 | Maximum scale factor. (Note that the default 1 will not increase content size on larger screens!)
data-width | 1920 (px) | Width of target screen size. When presentation is viewed on a larger or smaller screen, impress.js will scale all content automatically.
data-height | 1080 (px) | Height of target screen size.
data-max-scale | 3 | Maximum scale factor. (Note that the default 1 will not increase content size on larger screens!)
data-min-scale | 0 | Minimum scale factor.
data-perspective | 1000 | Perspective for 3D rendering. See https://developer.mozilla.org/en/CSS/perspective

Expand Down
6 changes: 3 additions & 3 deletions js/impress.js
Original file line number Diff line number Diff line change
Expand Up @@ -169,9 +169,9 @@

// Some default config values.
var defaults = {
width: 1024,
height: 768,
maxScale: 1,
width: 1920,
height: 1080,
maxScale: 3,
minScale: 0,

perspective: 1000,
Expand Down
6 changes: 3 additions & 3 deletions src/impress.js
Original file line number Diff line number Diff line change
Expand Up @@ -167,9 +167,9 @@

// Some default config values.
var defaults = {
width: 1024,
height: 768,
maxScale: 1,
width: 1920,
height: 1080,
maxScale: 3,
minScale: 0,

perspective: 1000,
Expand Down

0 comments on commit 78c954a

Please sign in to comment.