Skip to content

Instantly share code, notes, and snippets.

@marek-saji

marek-saji/index.html

Created March 15, 2012 23:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save marek-saji/2047501 to your computer and use it in GitHub Desktop.
Save marek-saji/2047501 to your computer and use it in GitHub Desktop.
Download ZIP
ania's squirrel boy
Raw
index.html
<!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>squirrel boy</title>
<meta name="description" content="" />
<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="http://bartaz.github.com/impress.js/css/impress-demo.css" rel="stylesheet" />
<style>
.step:not(.active) {
opacity : 1;
}
.step#start {
text-align : center;
}
.step#start:not(.active) p {
display : none;
}
</style>
<link rel="shortcut icon" href="http://bartaz.github.com/impress.js/favicon.png" />
<link rel="apple-touch-icon" href="http://bartaz.github.com/impress.js/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 class="step" id="start" data-scale="0.03" data-y="270" data-x="125">
<p>
Poczekaj, aż tło nie będzie takie szare i naduś strzałkę w prawo.
</p>
<p>
Albo spację.
</p>
</div>
<div class="step" id="f01" data-scale="0.33" data-y="-200" data-x="-300"></div>
<div class="step" id="f02" data-scale="0.33" data-y="-200" data-x="0"></div>
<div class="step" id="f03" data-scale="0.33" data-y="-200" data-x="300"></div>
<div class="step" id="f04" data-scale="0.20" data-y="-15" data-x="-400"></div>
<div class="step" id="f05" data-scale="0.20" data-y="-15" data-x="-190"></div>
<div class="step" id="f06" data-scale="0.25" data-y="-15" data-x="25"></div>
<div class="step" id="f07" data-scale="0.15" data-y="-15" data-x="300"></div>
<div class="step" id="f08" data-scale="0.33" data-y="180" data-x="-400"></div>
<div class="step" id="f09" data-scale="0.33" data-y="180" data-x="-190"></div>
<div class="step" id="f10" data-scale="0.33" data-y="200" data-x="60"></div>
<div class="step" id="f11" data-scale="0.33" data-y="180" data-x="350"></div>
<div class="step" id="fin" data-scale="0.06" data-y="290" data-x="395"></div>
<div class="step" id="overview" data-x="0" data-y="0" data-scale="1">
<img src="http://i.minus.com/ifQfGNJYgcWvC.jpg" alt="squirrel boy!" style="width: 100%" />
</div>
</div>
<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>Tap on the left or right to navigate</p>";
}
</script>
<script src="http://bartaz.github.com/impress.js/js/impress.js"></script>
<script>impress();</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment