summaryrefslogtreecommitdiff
path: root/reveal.js/demo.html
diff options
context:
space:
mode:
Diffstat (limited to 'reveal.js/demo.html')
-rw-r--r--reveal.js/demo.html58
1 files changed, 28 insertions, 30 deletions
diff --git a/reveal.js/demo.html b/reveal.js/demo.html
index 71cac98..ea42adf 100644
--- a/reveal.js/demo.html
+++ b/reveal.js/demo.html
@@ -19,7 +19,7 @@
19 <link rel="stylesheet" href="dist/theme/black.css" id="theme"> 19 <link rel="stylesheet" href="dist/theme/black.css" id="theme">
20 20
21 <!-- Theme used for syntax highlighting of code --> 21 <!-- Theme used for syntax highlighting of code -->
22 <link rel="stylesheet" href="plugin/highlight/monokai.css" id="highlight-theme"> 22 <link rel="stylesheet" href="plugin/highlight/monokai.css">
23 </head> 23 </head>
24 24
25 <body> 25 <body>
@@ -186,7 +186,7 @@
186 Write content using inline or external Markdown. 186 Write content using inline or external Markdown.
187 Instructions and more info available in the [docs](https://revealjs.com/markdown/). 187 Instructions and more info available in the [docs](https://revealjs.com/markdown/).
188 188
189 ```[] 189 ```html []
190 <section data-markdown> 190 <section data-markdown>
191 ## Markdown support 191 ## Markdown support
192 192
@@ -249,17 +249,17 @@
249 <p> 249 <p>
250 reveal.js comes with a few themes built in: <br> 250 reveal.js comes with a few themes built in: <br>
251 <!-- Hacks to swap themes after the page has loaded. Not flexible and only intended for the reveal.js demo deck. --> 251 <!-- Hacks to swap themes after the page has loaded. Not flexible and only intended for the reveal.js demo deck. -->
252 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/black.css'); return false;">Black (default)</a> - 252 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/black.css'); return false;">Black (default)</a> -
253 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/white.css'); return false;">White</a> - 253 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/white.css'); return false;">White</a> -
254 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/league.css'); return false;">League</a> - 254 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/league.css'); return false;">League</a> -
255 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/sky.css'); return false;">Sky</a> - 255 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/sky.css'); return false;">Sky</a> -
256 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/beige.css'); return false;">Beige</a> - 256 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/beige.css'); return false;">Beige</a> -
257 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/simple.css'); return false;">Simple</a> <br> 257 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/simple.css'); return false;">Simple</a> <br>
258 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/serif.css'); return false;">Serif</a> - 258 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/serif.css'); return false;">Serif</a> -
259 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/blood.css'); return false;">Blood</a> - 259 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/blood.css'); return false;">Blood</a> -
260 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/night.css'); return false;">Night</a> - 260 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/night.css'); return false;">Night</a> -
261 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/moon.css'); return false;">Moon</a> - 261 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/moon.css'); return false;">Moon</a> -
262 <a href="#" onclick="document.getElementById('theme').setAttribute('href','css/theme/solarized.css'); return false;">Solarized</a> 262 <a href="#" onclick="document.getElementById('theme').setAttribute('href','dist/theme/solarized.css'); return false;">Solarized</a>
263 </p> 263 </p>
264 </section> 264 </section>
265 265
@@ -281,7 +281,7 @@
281 <h2>Tiled Backgrounds</h2> 281 <h2>Tiled Backgrounds</h2>
282 <pre><code class="hljs html" style="word-wrap: break-word;">&lt;section data-background="image.png" data-background-repeat="repeat" data-background-size="100px"&gt;</code></pre> 282 <pre><code class="hljs html" style="word-wrap: break-word;">&lt;section data-background="image.png" data-background-repeat="repeat" data-background-size="100px"&gt;</code></pre>
283 </section> 283 </section>
284 <section data-background-video="https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.mp4" data-background-color="#000000"> 284 <section data-background-video="https://static.slid.es/site/homepage/v1/homepage-video-editor.mp4" data-background-color="#000000">
285 <div style="background-color: rgba(0, 0, 0, 0.9); color: #fff; padding: 20px;"> 285 <div style="background-color: rgba(0, 0, 0, 0.9); color: #fff; padding: 20px;">
286 <h2>Video Backgrounds</h2> 286 <h2>Video Backgrounds</h2>
287 <pre><code class="hljs html" style="word-wrap: break-word;">&lt;section data-background-video="video.mp4,video.webm"&gt;</code></pre> 287 <pre><code class="hljs html" style="word-wrap: break-word;">&lt;section data-background-video="video.mp4,video.webm"&gt;</code></pre>
@@ -451,25 +451,23 @@ Reveal.on( 'customevent', function() {
451 </div> 451 </div>
452 452
453 <script src="dist/reveal.js"></script> 453 <script src="dist/reveal.js"></script>
454 <script src="plugin/zoom/zoom.js"></script>
455 <script src="plugin/notes/notes.js"></script>
456 <script src="plugin/search/search.js"></script>
457 <script src="plugin/markdown/markdown.js"></script>
458 <script src="plugin/highlight/highlight.js"></script>
459 <script> 454 <script>
455 Reveal.initialize();
460 456
461 // Also available as an ES module, see: 457 const loadScript = src => {
462 // https://revealjs.com/initialization/ 458 return new Promise((resolve, reject) => {
463 Reveal.initialize({ 459 const script = document.createElement('script');
464 controls: true, 460 script.type = 'text/javascript';
465 progress: true, 461 script.onload = resolve;
466 center: true, 462 script.onerror = reject;
467 hash: true, 463 script.src = src;
468 464 document.head.append(script);
469 // Learn about plugins: https://revealjs.com/plugins/ 465 })
470 plugins: [ RevealZoom, RevealNotes, RevealSearch, RevealMarkdown, RevealHighlight ] 466 }
471 });
472 467
468 loadScript( 'plugin/highlight/highlight.js' ).then(() => {
469 Reveal.registerPlugin( RevealHighlight )
470 })
473 </script> 471 </script>
474 472
475 </body> 473 </body>