-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
94 lines (83 loc) · 3.16 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
<!DOCTYPE html>
<html>
<head>
<title>ROAD TO INFINITY</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/2.2.0/anime.min.js" defer></script>
<link rel="stylesheet" href="./style.css">
<!-- Meta tags -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta name="keywords" content="GAME, ROAD TO INFINITY" />
<meta name="author" content="ProgrammerXD / Naman Saini" />
<meta name="title" content="ROAD TO INFINITY" />
<meta name="description" content="First GAME by Naman Saini/ProgrammerXD" />
<meta property="og:image" content="https://telegra.ph/file/c303d7980473ddc6d4714.jpg" />
<style type="text/css">
</style>
</head>
<body>
<h1 class="gameName">> Game Name : Road To Infinity </h1>
<!-- Scores -->
<div id="scores">
<p> <span id="count" class="number-animate" data-end-value="500000" data-increment="1"
data-duration="4000000">1</span> </p>
</div>
<!-- Player -->
<div id="man"><img id="plr" src="Man.webp" height="100" width="100"></div>
<!-- Play Area-->
<div id="playArea">
<marquee id="obstacles" scroll-behaviour="scroll" s direction="left" loop="true" scrollmount="500"></marquee>
</div>
<!-- Floor -->
<div id="stage">
<div id="cI">
<h2>Controls & Instructions :- </h2>
<ul>
<li>Press start to start the game</li>
<li>Tap on screen to jump</li>
<li>Tap twice for Double jump</li>
<li>Avoid the obstacles</li>
<li>Keep tapping for god mode</li>
<li>Points counts on time you survive</li>
</ul>
</div>
</div><br>
<!-- Start Button -->
<button id="start">START</button>
<!-- Modal -->
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<span class="close" style="color: red;">×</span>
<p>This is my First Game ever</p>
<p>Hope you like it (you'll not lol)</p>
</div>
</div>
<script>
// Get the modal
var modal = document.getElementById("myModal");
// Get the button that opens the modal
var btn = document.getElementById("start");
// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];
// open the modal by default
window.onload = function () {
modal.style.display = "block";
}
// When the user clicks on <span> (x), close the modal
span.onclick = function () {
modal.style.display = "none";
}
// When the user clicks anywhere outside of the modal, close it
window.onclick = function (event) {
if (event.target !== modal) {
modal.style.display = "none";
}
}
</script>
<audio id="bm" hidden>
<source src="BgMusic.mp3">
</audio>
<script src="firstGame.js" type="text/javascript" defer></script>
<script src="./anime-master/lib/anime.min.js" type="text/javascript" defer></script>
</body>
</html>