explain fragments in readme

This commit is contained in:
Hakim El Hattab 2012-10-20 15:20:08 -03:00
parent da40cf2172
commit c13390354b

View file

@ -174,6 +174,34 @@ Reveal.addEventListener( 'slidechanged', function( event ) {
} );
```
### Internal links
It's easy to link between slides. The first example below targets the index of another slide whereas the second targets a slide with an ID attribute (```<section id="some-slide">```):
```html
<a href="#/2/2">Link</a>
<a href="#/some-slide">Link</a>
```
### Fullscreen mode
Just press »F« on your keyboard to show your presentation in fullscreen mode. Press the »ESC« key to exit fullscreen mode.
### Fragments
Fragments are used to highlight individual elements on a slide. Every elmement with the class ```fragment``` will be stepped through before moving on to the next slide. Here's an example: http://lab.hakim.se/reveal-js/#/16
The default fragment style is to start out invisible and fade in. This style can be changed by appending a different class to the fragment:
```html
<section>
<p class="fragment grow">grow</p>
<p class="fragment shrink">shrink</p>
<p class="fragment roll-in">roll-in</p>
<p class="fragment fade-out">fade-out</p>
<p class="fragment highlight-red">highlight-red</p>
<p class="fragment highlight-green">highlight-green</p>
<p class="fragment highlight-blue">highlight-blue</p>
</section>
```
### Fragment events
When a slide fragment is either shown or hidden reveal.js will dispatch an event.
@ -187,16 +215,6 @@ Reveal.addEventListener( 'fragmenthidden', function( event ) {
} );
```
### Internal links
It's easy to link between slides. The first example below targets the index of another slide whereas the second targets a slide with an ID attribute (```<section id="some-slide">```):
```html
<a href="#/2/2">Link</a>
<a href="#/some-slide">Link</a>
```
### Fullscreen mode
Just press »F« on your keyboard to show your presentation in fullscreen mode. Press the »ESC« key to exit fullscreen mode.
## PDF Export