/
index.html
108 lines (87 loc) · 3.28 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=1024" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>TOOLS 2012Q1 Release Notes</title>
<link href="http://fonts.googleapis.com/css?family=Open+Sans:regular,semibold,italic,italicsemibold|PT+Sans:400,700,400italic,700italic|PT+Serif:400,700,400italic,700italic" rel="stylesheet" />
<link href="css/impress-demo.css" rel="stylesheet" />
<link rel="shortcut icon" href="favicon.png" />
<link rel="apple-touch-icon" href="apple-touch-icon.png" />
</head>
<body class="impress-not-supported">
<div class="fallback-message">
<p>Your browser <b>doesn't support the features required</b> by impress.js, so you are presented with a simplified version of this presentation.</p>
<p>For the best experience please use the latest <b>Chrome</b>, <b>Safari</b> or <b>Firefox</b> browser.</p>
</div>
<div id="impress">
<div id="opening" class="step" data-x="-1000" data-y="-1500" data-scale="1">
<h4>TOOLS 2012<br> Q1 <br>Release Notes</h4>
</div>
<div class="step" data-x="2000" data-y="-1500">
<h1>Release Dates<h1>
<br>
<h2>April 20 2012</h2> <p>Beta</p>
<br>
<h2>May 7 2012</h2> <p>Release<p>
<br>
<h3><sup>*</sup> We're currently in a closed Alpha.</h3>
</div>
<div id="title" class="step" data-x="0" data-y="0" data-scale="4">
<h1>Features</h1>
</div>
<!--
This element introduces rotation.
Notation shouldn't be a surprise. We use `data-rotate="90"` attribute, meaning that this
element should be rotated by 90 degrees clockwise.
-->
<div id="Q1-feature-list" class="step" data-x="0" data-y="4500" data-z="-3000" data-rotate="90" data-scale="1">
<ul>
<li>Feature 1</li>
<li>Feature 2</li>
<li>Feature 3</li>
<li>Feature 4</li>
<li>Feature 5</li>
<li>Feature 6</li>
<li>Feature 7</li>
<li>Feature 8</li>
<li>Feature 9</li>
<li>Feature 10</li>
<li>Feature 11</li>
<li>Feature 12</li>
<li>Feature 13</li>
<li>Feature 14</li>
</ul>
</div>
<div id="big" class="step" data-x="7500" data-y="2100" data-rotate="180" data-scale="6">
<h1>Plans for <b>Q2</b></h1>
</div>
<div id="Q2-feature-list" class="step" data-x="15000" data-y="2100" data-z="-3000" data-rotate="90" data-scale="1">
<ul>
<li>Feature 1</li>
<li>Feature 2</li>
<li>Feature 3</li>
<li>Feature 4</li>
<li>Feature 5</li>
<li>Feature 6</li>
<li>Feature 7</li>
<li>Feature 8</li>
<li>Feature 9</li>
<li>Feature 10</li>
</ul>
</div>
<div id="QA" class="step" data-x="15000" data-y="3100" data-z="-42000" data-rotate="90" data-scale="1">
<h4>Questions?</h4>
<div class="hint">
<p>Use a spacebar or arrow keys to navigate</p>
</div>
<script>
if ("ontouchstart" in document.documentElement) {
document.querySelector(".hint").innerHTML = "<p>TOOLS on the left or right to navigate</p>";
}
</script>
<script src="js/impress.js"></script>
<script>impress().init();</script>
</body>
</html>