-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
83 lines (77 loc) · 3.34 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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>...</title>
<meta name="description" content="does google really care">
<meta name="author" content="bill rowland">
<link rel="shortcut icon" href="images/favicon.ico"/>
<link rel="stylesheet" href="css/styles.css">
<link href='http://fonts.googleapis.com/css?family=Tangerine|Italiana' rel='stylesheet' type='text/css'>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div id='pageOne'>
<h3>...</h3>
</div>
<hr />
<section id='cartoon'/>
<div id="blue_wrapper" data-smooth-scrolling="off">
<div id="blue" data-anchor-target="#red" data--100="background-color:rgb(0,255,0)"></div>
</div>
<!-- <div id='wrapper'
data-anchor-target="#cartoon"
data-0='background-color:rgb(0,0,255);'
data--250-top='position: fixed; background-color:rgb(0,255,0);'>
--><div id='wrapper'>
<div id="container">
<span id='leftGradient'></span>
<span id='rightGradient'></span>
<div data-0="background-color:rgb(0,0,255);" data-500="background-color:rgb(255,0,0);">WOOOT</div>
<div id='x'
data-0="position: relative; "
data-0="background-color: rgb(240,240,240)"
data-300="background-color: rgb(240,240,240)"
data-400="background-color: rgb(64,64,64)"
data-400="position: relative; "
data-401="position: absolute; "
>this is a test
</div>
<div id='slide'
data-200="transform:translateX(155px);"
data-310="transform:translateX(-370px);"
data-390="transform:translateX(-370px);"
data-400="transform:translateX(-895px);">
<span class='panel' data-0="opacity:1;" data-250="opacity:.3"></span>
<span class='panel' data-0="opacity:.3;" data-250="opacity:1" data-500="opacity: .3;"></span>
<span class='panel' data-0="opacity:.3;" data-250="opacity:.3" data-500="opacity: 1;"></span>
</div>
</div>
</div>
<div id="red" ></div>
<div id='test'>
<span data-0="opacity:1;" data-250="opacity:0;">0</span>
<span data-0="opacity:0;" data-250="opacity:1;" data-500="opacity:0;">250</span>
<span data-0="opacity:0;" data-250="opacity:0;" data-500="opacity:1;" data-750="opacity:0;">500</span>
<span data-0="opacity:0;" data-250="opacity:0;" data-500="opacity:0;" data-750="opacity:1;" data-1000="opacity:0;">750</span>
<!-- <div id='box2' class='box' >WOOOT6</div> -->
<!-- <div class='box'
data-0="background-color:rgb(0,0,255);"
data-500="background-color:rgb(255,0,0);"
data-1000="background-color:rgb(0,0,255);"
>WOOOT1</div>
</div>
--><!--<div class='box' data-0="background-color:rgb(0,0,255);transform:rotate(0deg);" data-500="background-color:rgb(255,0,0);transform:rotate(360deg);">WOOOT2</div>
<div class='box' data-0="background-color:rgb(0,0,255);transform[bounce]:rotate(0deg);" data-200="background-color:rgb(255,0,0);transform[bounce]:rotate(360deg);">WOOOT3</div>
<div class='box' data-0="background-color:rgb(0,0,255);transform[bounce]:rotate(0deg);" data-top="background-color:rgb(a28,255,0);transform[bounce]:rotate(360deg);">WOOOT4</div>
<div class='box' data-0="transform:translateX(0%)" data-500="transform:translateX(100%)" >WOOOT5</div>
--><!-- <div id='box2' class='box' data-0="margin-top:0px;" data-500="margin-top: 500px;" >WOOOT</div> -->
</div>
</section>
<script src ="js/jquery-2.1.1.min.js"></script>
<script src='js/skrollr.js'></script>
<script src='js/m.js'></script>
</body>
</html>