start by deflecting to the right→
or ↓ dive down to learn how to navigate
slide | slip | slip | slip | shortcut |
---|---|---|---|---|
0 | splash | controls | hypernav | themes |
1 | setup | spinup | cameras | rfrncframes |
2 | video | timelapse | keyfeatures | exp²lorer |
3 | renders | digireel | rotoscope | |
4 | dyedelay | |||
5 | crystalfall | vertstruct | ||
6 | longevo | underflows | ||
7 | schematic | flowskey | ||
8 | theory | mitGCM | ||
9 | tradewinds | moredemos |
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.
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
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' );
} );
Quotes can be used inline or put into a block like this. The block's lightweight container could be used for annotative text, or its style should be ported to a separate caption class.
This block of text can be edited -- try clicking, typing.
Currently, text is only saved until page refresh.
But functionality may be extended for storing a version locally.
Again, this is a re-purposing of a < code > element,
as you can tell by the erratic hilighting.
Thus it should be ported to contenteditable caption class.