default content update; remove image slide, add two new slides

This commit is contained in:
Hakim El Hattab 2014-12-12 15:52:25 +01:00
parent b133468f3e
commit 96b26514e6
2 changed files with 59 additions and 51 deletions

View File

@ -617,7 +617,7 @@ The framework comes with a few different themes included:
- simple: White background, black text, blue links - simple: White background, black text, blue links
- solarized: Cream-colored background, dark green text, blue links - solarized: Cream-colored background, dark green text, blue links
Each theme is available as a separate stylesheet. To change theme you will need to replace **default** below with your desired theme name in index.html: Each theme is available as a separate stylesheet. To change theme you will need to replace **black** below with your desired theme name in index.html:
```html ```html
<link rel="stylesheet" href="css/theme/black.css" id="theme"> <link rel="stylesheet" href="css/theme/black.css" id="theme">

View File

@ -53,10 +53,6 @@
<p> <p>
reveal.js is a framework that enables you to create beautiful presentations using HTML. This demo presentation will tell you more about what you can do with it. reveal.js is a framework that enables you to create beautiful presentations using HTML. This demo presentation will tell you more about what you can do with it.
</p> </p>
<aside class="notes">
Oh hey, these are some notes. They'll be hidden in your presentation, but you can see them if you open the speaker notes window (hit 's' on your keyboard).
</aside>
</section> </section>
<!-- Example of nested vertical slides --> <!-- Example of nested vertical slides -->
@ -184,27 +180,6 @@
</p> </p>
</section> </section>
<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 page background.
</p>
</section>
<section data-state="customevent">
<h2>State Events</h2>
<p>
Additionally custom events can be triggered on a per slide basis by binding to the <code>data-state</code> name.
</p>
<pre><code class="javascript" data-trim contenteditable style="font-size: 18px;">
Reveal.addEventListener( 'customevent', function() {
console.log( '"customevent" has fired' );
} );
</code></pre>
</section>
<section> <section>
<section data-background="#dddddd"> <section data-background="#dddddd">
<h2>Slide Backgrounds</h2> <h2>Slide Backgrounds</h2>
@ -247,6 +222,27 @@ Reveal.addEventListener( 'customevent', function() {
<pre><code style="word-wrap: break-word;">&lt;section data-background-transition="zoom"&gt;</code></pre> <pre><code style="word-wrap: break-word;">&lt;section data-background-transition="zoom"&gt;</code></pre>
</section> </section>
<section>
<h2>Pretty Code</h2>
<pre><code data-trim contenteditable>
function linkify( selector ) {
if( supports3DTransforms ) {
var nodes = document.querySelectorAll( selector );
for( var i = 0, len = nodes.length; i &lt; len; i++ ) {
var node = nodes[i];
if( !node.className ) {
node.className += ' roll';
}
}
}
}
</code></pre>
<p>Courtesy of <a href="http://softwaremaniacs.org/soft/highlight/en/description/">highlight.js</a>.</p>
</section>
<section> <section>
<h2>Marvelous List</h2> <h2>Marvelous List</h2>
<ul> <ul>
@ -308,27 +304,6 @@ Reveal.addEventListener( 'customevent', function() {
</blockquote> </blockquote>
</section> </section>
<section>
<h2>Pretty Code</h2>
<pre><code data-trim contenteditable>
function linkify( selector ) {
if( supports3DTransforms ) {
var nodes = document.querySelectorAll( selector );
for( var i = 0, len = nodes.length; i &lt; len; i++ ) {
var node = nodes[i];
if( !node.className ) {
node.className += ' roll';
}
}
}
}
</code></pre>
<p>Courtesy of <a href="http://softwaremaniacs.org/soft/highlight/en/description/">highlight.js</a>.</p>
</section>
<section> <section>
<h2>Intergalactic Interconnections</h2> <h2>Intergalactic Interconnections</h2>
<p> <p>
@ -338,10 +313,13 @@ function linkify( selector ) {
</section> </section>
<section> <section>
<h2>Spectacular image!</h2> <h2>Speaker View</h2>
<a href="http://lab.hakim.se/meny/" target="_blank"> <p>There's a <a href="https://github.com/hakimel/reveal.js#speaker-notes">speaker view</a>. It includes a timer, preview of the upcoming slide as well as your speaker notes.</p>
<img width="320" height="299" data-src="http://s3.amazonaws.com/hakim-static/portfolio/images/meny.png" alt="Meny"> <p>Press the <em>S</em> key to try it out.</p>
</a>
<aside class="notes">
Oh hey, these are some notes. They'll be hidden in your presentation, but you can see them if you open the speaker notes window (hit 's' on your keyboard).
</aside>
</section> </section>
<section> <section>
@ -353,6 +331,27 @@ function linkify( selector ) {
</script> </script>
</section> </section>
<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 page background.
</p>
</section>
<section data-state="customevent">
<h2>State Events</h2>
<p>
Additionally custom events can be triggered on a per slide basis by binding to the <code>data-state</code> name.
</p>
<pre><code class="javascript" data-trim contenteditable style="font-size: 18px;">
Reveal.addEventListener( 'customevent', function() {
console.log( '"customevent" has fired' );
} );
</code></pre>
</section>
<section> <section>
<h2>Take a Moment</h2> <h2>Take a Moment</h2>
<p> <p>
@ -360,6 +359,15 @@ function linkify( selector ) {
</p> </p>
</section> </section>
<section>
<h2>Much more</h2>
<ul>
<li>Right-to-left support</li>
<li><a href="https://github.com/hakimel/reveal.js#auto-sliding">Auto-progression</a></li>
<li><a href="https://github.com/hakimel/reveal.js#parallax-background">Parallax backgrounds</a></li>
</ul>
</section>
<section> <section>
<h2>Stellar Links</h2> <h2>Stellar Links</h2>
<ul> <ul>