-
Notifications
You must be signed in to change notification settings - Fork 4
/
index.html
32 lines (30 loc) · 1.5 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
<!DOCTYPE html>
<html>
<head>
<TITLE>cubeTransition.js</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link href="css/style.css" rel="stylesheet" />
<script src='js/jquery.min.js'></script>
</head>
<body>
<div id="cubeTransition">
<div class="page1"><h2>cubeTransition.js</h2></div>
<div class="page2"><h2>Elegant,</h2></div>
<div class="page3"><h2>Exciting!</h2></div>
<div class="page4"><h2>Simple.</h2></div>
</div>
<ul id="bullets"></ul>
<div class="credit">a simple demo for cubeTransition.js</div>
<div style="position: fixed;right: 0;top: 0;"><div style="border-bottom:3px solid #d7d7d7;border-top:3px solid #d7d7d7;width:410px;height:83px;background:#efefef;font-size:2.2rem;text-shadow:#868686 1px 1px 20px;display:flex;justify-content:center;align-items:center;transform:rotate(45deg) translate(110px,-20px);"><a style="color:#3f3f3f;text-decoration: none;" onMouseOver="this.style.textDecoration='underline'" onMouseOut="this.style.textDecoration='none'" href="//github.com/html50/cubeTransition.js">star me on github</a></div></div>
</a>
<script>
function animationOut(i){}
function animationIn(i){}
//well, you need modify the cubeTransition.js file
//delete the two functions if you dont need this kinda after/before swtching's animation.
</script>
<script src='js/wheel-indicator.js'></script>
<script src="js/jquery.touchSwipe.js"></script>
<script src="js/cubeTransition.js"></script>
</body></html>