/
space.html
75 lines (67 loc) · 3.1 KB
/
space.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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="description"
content="Free Arcade Games - Online browser play of old school arcade games. Enjoy some of the classics, such as Pacman, Space Invader, Tetris, Snake and more. Online Games and free emulator play designed and coded in Javascript, CSS and HTML.">
<meta name="robots" content="index, follow">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Space Invaders | Arcade Room | Old School Games in Javascript | Classic Online Games</title>
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@100;800&display=swap" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<!-- Flickity Carousel -->
<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">
<!-- CSS links -->
<link rel="stylesheet" href="styles/styles.css">
<link rel="stylesheet" href="styles/space.css">
</head>
<body>
<div class="container">
<div class="back-btn">
<img src="images/arcademachine.png" onclick="backToGamesRoom();" alt="">
</div>
<div class="about-section">
<div class="start">
<p>Use the left and right keys to move the player. Use the space bar to shoot.
<br>Good luck!
</p>
<br>
<br>
<p>Press N to start a new game</p>
</div>
<div class="notCompatible">
<p>Oops! This game is not compatible with your device. Please try again using a desktop. Sorry for the inconvenience!</p>
</div>
<div class="wrap">
<div class="game-wrapper">
<div class="game"></div>
<div class="playAgain">
<h1>YOU WON</h1>
<p>Congratulations!You won the game</p>
<button class="btn" onclick="history.go(0)">Play Again</button>
</div>
<div class="gameOver">
<h1>GAME OVER</h1>
<p>You lost the game</p>
<button class="btn" onclick="history.go(0)">Play Again</button>
</div>
</div>
</div>
</div>
</div>
<!-- Flickity -->
<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>
<!-- GSAP CDN -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.0/gsap.min.js" charset="utf-8"></script>
<!-- GSAP ScrollTo CDN -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.0/ScrollToPlugin.min.js" charset="utf-8"></script>
<!-- JQUERY CDN -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<!-- Javascript File -->
<script src="js/index.js" charset="utf-8"></script>
<script src="js/space.js" charset="utf-8"></script>
</body>
</html>