-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
45 lines (45 loc) · 1.88 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Lights Out!</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<section class="title">
<h2>Lights Out</h2>
<p id ="instructions">Ghost have taken over your house and you have escaped outside to find out you left your car keys
inside. Navigate through the house and grab your car keys and escape again so you can go for help. Use the lights to help
locate the ghost but be warned the ghost will turn the light off again in a few seconds and wont let you turn them back on for a while
<br> WASD to move : F to turn on lights
</p>
<button id="start">Start Game</button>
</section>
<section class="win hidden">
<img src="assets/ghostbusters.jpg" class="ghostbuster">
<p>The Ghostbusters are on the way</p>
</section>
<section class="lose hidden">
<img src="assets/died.png" class="died">
<p>You are now a ghost</p>
</section>
<img class ="hidden"id="player" src ="assets/player.png">
<img class ="hidden"id="ghost" src ="assets/ghost.png">
<img class ="hidden"id="couch" src ="assets/couch1.png">
<img class ="hidden"id="bed" src ="assets/bed.png">
<img class ="hidden"id="toilet" src ="assets/toilet.png">
<img class ="hidden"id="counter-right" src ="assets/countertop-right.png">
<img class ="hidden"id="counter-top" src ="assets/countertop-top.png">
<img class ="hidden"id="floor" src ="assets/floor.png">
<img class ="hidden"id="key" src ="assets/key.png">
<img class ="hidden"id="table" src ="assets/table.png">
<img class ="hidden"id="island" src ="assets/island.png">.
<img class ="hidden"id="coffee" src ="assets/coffee-table.png">
<img class ="hidden"id="tv" src ="assets/tv.png">
<div class="container" id="darkness">
<canvas id="game" class ="hidden">
</canvas>
</div>
<script src="script.js"></script>
</body>
</html>