-
Notifications
You must be signed in to change notification settings - Fork 68
/
Copy pathconnect4.html
80 lines (78 loc) · 3.26 KB
/
connect4.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
<!-- audio code credit to karen @https://github.com/ksivaneri001/pset-9
/ @ https://ksivaneri001.github.io/pset-9/index.html-->
<!DOCTYPE html>
<html lang="en">
<head>
<title>connect 4</title>
<link rel="shortcut icon" href="images/connect4.png" />
<link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/minecraftia" type="text/css"/>
<!-- minecraft font -->
<!-- <link rel="stylesheet" href="styles/connect4.css" /> -->
<link href="css/connect4.css" rel="stylesheet" type="text/css" />
<script defer src="js/connect4.js"></script>
</head>
<body>
<audio id="z-audio">
<source src="audio/minecraft-zombie.mp3" type="audio/mpeg">
</audio>
<!-- <audio id="game-over-audio">
<source src="audio/game_over.mp3" type="audio/mpeg">
</audio>
<audio id="glass-break-audio">
<source src="audio/glass_break.mp3" type="audio/mpeg">
</audio> -->
<div id = "home">
<a href="index.html"><img src="images/home.png"></a>
</div>
<h1>connect four</h1>
<h2 id="turn">turn: zombie</h2>
</div>
<div class="container column">
<div class="wrap container" id="board">
<div class="square" id="square0"></div>
<div class="square" id="square1"></div>
<div class="square" id="square2"></div>
<div class="square" id="square3"></div>
<div class="square" id="square4"></div>
<div class="square" id="square5"></div>
<div class="square" id="square6"></div>
<div class="square" id="square7"></div>
<div class="square" id="square8"></div>
<div class="square" id="square9"></div>
<div class="square" id="square10"></div>
<div class="square" id="square11"></div>
<div class="square" id="square12"></div>
<div class="square" id="square13"></div>
<div class="square" id="square14"></div>
<div class="square" id="square15"></div>
<div class="square" id="square16"></div>
<div class="square" id="square17"></div>
<div class="square" id="square18"></div>
<div class="square" id="square19"></div>
<div class="square" id="square20"></div>
<div class="square" id="square21"></div>
<div class="square" id="square22"></div>
<div class="square" id="square23"></div>
<div class="square" id="square24"></div>
<div class="square" id="square25"></div>
<div class="square" id="square26"></div>
<div class="square" id="square27"></div>
<div class="square" id="square28"></div>
<div class="square" id="square29"></div>
<div class="square" id="square30"></div>
<div class="square" id="square31"></div>
<div class="square" id="square32"></div>
<div class="square" id="square33"></div>
<div class="square" id="square34"></div>
<div class="square" id="square35"></div>
<div class="square" id="square36"></div>
<div class="square" id="square37"></div>
<div class="square" id="square38"></div>
<div class="square" id="square39"></div>
<div class="square" id="square40"></div>
<div class="square" id="square41"></div>
</div>
<center><div id="reset-button">Play Again!</div></center>
</div>
</body>
</html>