-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
112 lines (92 loc) · 3.17 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
109
110
111
112
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width; initial-scale=0.5; ">
<title>BOXX</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="js/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="js/jquery.touchSwipe.min.js"></script>
<script type="text/javascript" src="js/macrogo.js"></script>
</head>
<body>
<!-- Welcome screen -->
<div class="main-menu">
<div class="logo">
<img src="images/logo.png" alt="">
</div>
<ul class="nav">
<li><div class="button" data-action="start">Start Endless Mode</div></li>
<li><div class="button deactive" id="challenges">Challenges</div></li>
<li><div class="button" id="about">About</div></li>
</ul>
</div>
<!-- Playing screen -->
<div class="playing">
<div id="menu" class="closed"><span></span></div>
<div class="tools">
<div class="container">
<div class="half">
<strong>Score</strong>
<span id="score">0</span>
</div>
<div class="half">
<strong>Move</strong>
<span id="move">0</span>
</div>
</div>
</div>
<div class="game-container">
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<ul class="numbers">
</ul>
</div>
<!-- Pause screen -->
<div class="pause">
<ul class="nav">
<li><div class="button green" id="continue">Continue</div></li>
<li><div class="hr"></div></li>
<li><div class="button green" data-action="restart">Restart</div></li>
<li><div class="button black" id="exit">Exit to Main Menu</div></li>
</ul>
</div>
<!-- Gameover screen -->
<div class="gameover">
<img src="images/gameover.png" alt="">
<h2>GAME <br>OVER</h2>
<div class="button green" data-action="restart">Restart</div>
<div class="clear"></div>
<div class="button black" id="exit">Exit to Main Menu</div>
</div>
</div>
<!-- About screen -->
<div class="about">
<div class="menu opened"><span></span></div>
<div class="text-container">
<h1>About</h1>
Boxx is a game that developed with javascript and HTML5. This game plays on desktop and mobile browsers.
<br><br>
<b>How to Play:</b> You must reach 2048 with collect numbers to each other. And you can use arrow keys or swipe with your finger on touchable screens for doing that. When you swipe left, up, right, down, that two boxes with same number are collects. You will get points for each collect action.
<br><br>
<h3>Bora DAN</h3>
Follow me on <a href="http://twitter.com/bqra">Twitter</a>, <a href="http://dribbble.com/bqra">Dribbble</a>, <a href="http://codecanyon.net/user/bqra">CodeCanyon</a> and <a href="http://github.com/bqra">GitHub</a>
</div>
</div>
</body>
</html>