-
Notifications
You must be signed in to change notification settings - Fork 18
/
Copy pathindex.html
61 lines (58 loc) · 2.44 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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Head stores all the meta information(data about data) -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--Title of the page-->
<title>Racing Car Game</title>
<!-- Link for google fonts -->
<link href="https://fonts.googleapis.com/css?family=Josefin+Sans&display=swap" rel="stylesheet">
<!-- Link for style css where design part is done -->
<link href="style.css" rel="stylesheet">
</head>
<body>
<!-- Audio tag stores audio files like mp3,mp4 etc -->
<audio id="music">
<source src="assets/music.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<!-- Script tag is used to add javascript functionality to html page -->
<script>
//In below code,audio element is assigned to variable called myMusic
var myMusic= document.getElementById("music");
//Creating a function with name play() which is used to start/continue playing the music.mp3 audio file stored in myMusic variable
function play() {
myMusic.play();
}
//Creating a function with name play() which is used to stop/pause playing the music.mp3
function pause() {
myMusic.pause();
}
</script>
<div class="carGame">
<div class="score"></div>
<div class="startScreen">
<p>Press here to start <br>
Use Arrow keys to move <br>
Press Up arrow to move Up<br>
Press Down arrow to move Down <br>
Press Right arrow to move Right <br>
Press Left arrow to move Left <br>
If you hit another car you will lose.
</p>
<div>Select Level <br>
<span class="level">
<!-- onclick is the attribute for button tag which calls the respective function when clicked on it -->
<button id="easy" onclick="play()" >Easy</button>
<button id="moderate" onclick="play()" >Moderate</button>
<button id="difficult" onclick="play()" >Difficult</button>
</span>
</div>
</div>
<div class="gameArea"></div>
</div>
<!-- below tag includes all the javascript functionality from script.js into this index.html file -->
<script src="script.js"></script>
</body>
</html>