blob: 88119dc72f59535a54c5a711a4a6fc52241dfb86 [file] [log] [blame]
JJ Allaireefa6ad42016-01-30 13:12:05 -05001<!doctype html>
2<html lang="en">
3
4 <head>
5 <meta charset="utf-8">
6
7 <title>reveal.js - Slide Transitions</title>
8
9 <link rel="stylesheet" href="../../css/reveal.css">
10 <link rel="stylesheet" href="../../css/theme/white.css" id="theme">
11 <style type="text/css" media="screen">
12 .slides section.has-dark-background,
13 .slides section.has-dark-background h3 {
14 color: #fff;
15 }
16 .slides section.has-light-background,
17 .slides section.has-light-background h3 {
18 color: #222;
19 }
20 </style>
21 </head>
22
23 <body>
24
25 <div class="reveal">
26
27 <div class="slides">
28
29 <section>
30 <h3>Default</h3>
31 </section>
32
33 <section>
34 <h3>Default</h3>
35 </section>
36
37 <section data-transition="zoom">
38 <h3>data-transition: zoom</h3>
39 </section>
40
41 <section data-transition="zoom-in fade-out">
42 <h3>data-transition: zoom-in fade-out</h3>
43 </section>
44
45 <section>
46 <h3>Default</h3>
47 </section>
48
49 <section data-transition="convex">
50 <h3>data-transition: convex</h3>
51 </section>
52
53 <section data-transition="convex-in concave-out">
54 <h3>data-transition: convex-in concave-out</h3>
55 </section>
56
57 <section>
58 <section data-transition="zoom">
59 <h3>Default</h3>
60 </section>
61 <section data-transition="concave">
62 <h3>data-transition: concave</h3>
63 </section>
64 <section data-transition="convex-in fade-out">
65 <h3>data-transition: convex-in fade-out</h3>
66 </section>
67 <section>
68 <h3>Default</h3>
69 </section>
70 </section>
71
72 <section data-transition="none">
73 <h3>data-transition: none</h3>
74 </section>
75
76 <section>
77 <h3>Default</h3>
78 </section>
79
80 </div>
81
82 </div>
83
84 <script src="../../lib/js/head.min.js"></script>
85 <script src="../../js/reveal.js"></script>
86
87 <script>
88
89 Reveal.initialize({
90 center: true,
91 history: true,
92
93 // transition: 'slide',
94 // transitionSpeed: 'slow',
95 // backgroundTransition: 'slide'
96 });
97
98 </script>
99
100 </body>
101</html>