- Slides can be nested inside of other slides, - try pressing down. -
- - - -Press down or up to navigate.
-Cornify
- - - -That's it, time to go back up.
- - - -- Not a coder? No problem. There's a fully-featured visual editor for authoring these, try it out at http://slid.es. -
-- Press ESC to enter the slide overview. -
-- Hold down alt and click on any element to zoom in on it using zoom.js. Alt + click anywhere to zoom back out. -
-- Try it out! You can swipe through the slides and pinch your way to the overview. -
-
- You can select from different transitions, like:
- Cube -
- Page -
- Concave -
- Zoom -
- Linear -
- Fade -
- None -
- Default
-
- Reveal.js comes with a few themes built in:
- Default -
- Sky -
- Beige -
- Simple -
- Serif -
- Night
- Moon -
- Solarized
-
-
- * Theme demos are loaded after the presentation which leads to flicker. In production you should load your theme in the <head>
using a <link>
.
-
-
- Set data-state="something"
on a slide and "something"
- will be added as a class to the document element when the slide is open. This lets you
- apply broader style changes, like switching the background.
-
- Additionally custom events can be triggered on a per slide basis by binding to the data-state
name.
-
-Reveal.addEventListener( 'customevent', function() {
- console.log( '"customevent" has fired' );
-} );
-
-
- Set data-background="#007777"
on a slide to change the full page background to the given color. All CSS color formats are supported.
-
<section data-background="image.png">
- <section data-background="image.png" data-background-repeat="repeat" data-background-size="100px">
-
- Pass reveal.js the backgroundTransition: 'slide'
config argument to make backgrounds slide rather than fade.
-
- You can override background transitions per slide by using data-background-transition="slide"
.
-
- These guys come in two forms, inline:
- “The nice thing about standards is that there are so many to choose from”
and block:
-
- “For years there has been a theory that millions of monkeys typing at random on millions of typewriters would - reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.” --
-function linkify( selector ) {
- if( supports3DTransforms ) {
-
- var nodes = document.querySelectorAll( selector );
-
- for( var i = 0, len = nodes.length; i < len; i++ ) {
- var node = nodes[i];
-
- if( !node.className ) {
- node.className += ' roll';
- }
- }
- }
-}
-
- Courtesy of highlight.js.
-- You can link between slides internally, - like this. -
-Hit the next arrow...
-... to step through ...
-any type
There's a few styles of fragments, like:
-grow
-shrink
-roll-in
-fade-out
-highlight-red
-highlight-green
-highlight-blue
-current-visible
-highlight-current-blue
-Presentations can be exported to PDF, below is an example that's been uploaded to SlideShare.
- - -- Press b or period on your keyboard to enter the 'paused' mode. This mode is helpful when you want to take distracting slides off the screen - during a presentation. -
-