aboutsummaryrefslogtreecommitdiff
path: root/README.md
diff options
context:
space:
mode:
authorHakim El Hattab <hakim.elhattab@gmail.com>2013-09-15 14:44:45 -0400
committerHakim El Hattab <hakim.elhattab@gmail.com>2013-09-15 14:44:45 -0400
commit2fc0dfa8e189a924a0ea77780e13537a02ff4e01 (patch)
tree5eac71dd0553d117c855b8da7522d6d9dc337c3e /README.md
parent1fb85d4df6a5b5b971d3a1beaff2a659bab72470 (diff)
parent2bd228534b9e667ec465131ff35b09e0b41fe890 (diff)
downloadfosdem-2018-presentation-2fc0dfa8e189a924a0ea77780e13537a02ff4e01.tar
fosdem-2018-presentation-2fc0dfa8e189a924a0ea77780e13537a02ff4e01.tar.gz
merge parallax into dev, remove default image #595
Diffstat (limited to 'README.md')
-rw-r--r--README.md34
1 files changed, 34 insertions, 0 deletions
diff --git a/README.md b/README.md
index 6625972..03ec635 100644
--- a/README.md
+++ b/README.md
@@ -108,6 +108,16 @@ Reveal.initialize({
// Transition style for full page backgrounds
backgroundTransition: 'default' // default/linear/none
+
+ // Parallax background image
+ parallaxBackgroundImage: '', // CSS syntax, e.g. "url('a.jpg')"
+
+ // Parallax background size
+ parallaxBackgroundSize: '', // CSS syntax, e.g. "3000px 2000px"
+
+ // Number of slides away from the current that are visible
+ viewDistance: 3,
+
});
```
@@ -291,6 +301,30 @@ Slides are contained within a limited portion of the screen by default to allow
Backgrounds transition using a fade animation by default. This can be changed to a linear sliding transition by passing ```backgroundTransition: 'slide'``` to the ```Reveal.initialize()``` call. Alternatively you can set ```data-background-transition``` on any section with a background to override that specific transition.
+### Parallax Background
+
+If you want to use the parallax scrolling background, set the two following config properties when initializing reveal.js (the third one is optional )
+
+```javascript
+Reveal.initialize({
+
+ // Parallax background image
+ parallaxBackgroundImage: '', // CSS syntax, e.g. "url('a.jpg')"
+
+ // Parallax background size
+ parallaxBackgroundSize: '', // CSS syntax, e.g. "3000px 2000px" - currently only pixels are supported (don't use % or auto)
+
+ // This slide transition gives best results:
+ transition: linear
+
+});
+```
+
+Make sure that the background size is much bigger than screen size to allow for some scrolling.
+
+The image used in the background is made by Eli Mergel and is published under Creative Commons license on [Flickr](https://secure.flickr.com/photos/sp1te/3436256585/sizes/o/in/pool-856427@N25/).
+
+
### Slide Transitions
The global presentation transition is set using the ```transition``` config value. You can override the global transition for a specific slide by using the ```data-transition``` attribute: