diff options
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 49 |
1 files changed, 26 insertions, 23 deletions
@@ -183,29 +183,12 @@ </section> <section> - <section data-state="alert"> - <h2>Global State</h2> - <p> - Set <code>data-state="something"</code> on a slide and <code>"something"</code> - 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. - </p> - <a href="#" class="image navigate-down"> - <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow"> - </a> - </section> - <section data-state="blackout"> - <h2>"blackout"</h2> - <a href="#" class="image navigate-down"> - <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow"> - </a> - </section> - <section data-state="soothe"> - <h2>"soothe"</h2> - <a href="#" class="image navigate-next"> - <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Up arrow" style="-webkit-transform: rotate(-90deg);"> - </a> - </section> + <h2>Global State</h2> + <p> + Set <code>data-state="something"</code> on a slide and <code>"something"</code> + 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. + </p> </section> <section data-state="customevent"> @@ -221,6 +204,26 @@ Reveal.addEventListener( 'customevent', function() { </section> <section> + <section data-background="#007777"> + <h2>Slide Backgrounds</h2> + <p> + Set <code>data-background="#007777"</code> on a slide to change the full page background to the given color. All CSS color formats are supported. + </p> + <a href="#" class="image navigate-down"> + <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow"> + </a> + </section> + <section data-background="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png"> + <h2>Image Backgrounds</h2> + <pre><code><section data-background="image.png"></code></pre> + </section> + <section data-background="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" data-background-repeat="repeat" data-background-size="100px"> + <h2>Repeated Image Backgrounds</h2> + <pre><code style="word-wrap: break-word;"><section data-background="image.png" data-background-repeat="repeat" data-background-size="100px"></code></pre> + </section> + </section> + + <section> <h2>Clever Quotes</h2> <p> These guys come in two forms, inline: <q cite="http://searchservervirtualization.techtarget.com/definition/Our-Favorite-Technology-Quotations"> |