Skip to content
Browse files

* New example

  • Loading branch information...
1 parent 04875e8 commit 8e12c53d97cd5095887f48d91a186f15a21c06ab @joehewitt committed
Showing with 64 additions and 0 deletions.
  1. +64 −0 examples/example2.html
View
64 examples/example2.html
@@ -0,0 +1,64 @@
+<!doctype html>
+
+<html lang="en">
+<head>
+<title>Scrollability</title>
+<meta charset="utf-8"/>
+<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0" />
+<style type="text/css">
+
+html, body {
+ overflow: hidden;
+ padding: 0;
+ margin: 0;
+ background: #000;
+}
+
+#container {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ white-space: nowrap;
+}
+
+.page {
+ display: inline-block;
+ width: 100%;
+ height: 100%;
+ margin-right: 20px;
+ color: #fff;
+ font: 40px Helvetica;
+ padding: 10px;
+ -webkit-box-sizing: border-box;
+}
+
+</style>
+
+<script type="text/javascript" src="../scrollability.js"></script>
+
+<script language="javascript">
+
+var colors = [
+"blue",
+"green",
+"red",
+"gray",
+];
+
+addEventListener('DOMContentLoaded', function() {
+ var container = document.getElementById('container');
+ for (var i = 0; i < colors.length; ++i) {
+ var page = document.createElement('div');
+ page.className = 'page';
+ page.style.backgroundColor = colors[i];
+ page.innerHTML = 'Scroll horizontally between pages'
+ container.appendChild(page);
+ }
+});
+
+</script>
+</head>
+<body><div id="container" class="scrollable horizontal paginated"></div></body>
+</html>

0 comments on commit 8e12c53

Please sign in to comment.
Something went wrong with that request. Please try again.