-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
121 lines (104 loc) · 4.01 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
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="#">
<link rel="stylesheet" href="style.css" />
<script type="text/javascript">
const bgm = new Audio("game/sound/background.mp3?" + new Date().getTime());
bgm.importance = "high";
var nking = document.createElement("img");
nking.src = "game/images/king.png?" + new Date().getTime();
nking.importance = "high";
var fking = document.createElement("img");
fking.importance = "high";
fking.src = "game/images/king_fail.png?" + new Date().getTime();
var hking = document.createElement("img");
hking.src = "game/images/king_hu.png?" + new Date().getTime();
hking.importance = "high";
var ghost1 = document.createElement("img");
ghost1.importance = "high";
ghost1.src = "game/images/ghost1.png?" + new Date().getTime();
var ghost2 = document.createElement("img");
ghost2.src = "game/images/ghost2.png?" + new Date().getTime();
ghost2.importance = "high";
var enemy = [ghost1, ghost2];
var playbutton = document.createElement("img");
playbutton.src = "game/images/play.png?" + new Date().getTime();
playbutton.importance = "high";
const jumpM = new Audio("game/sound/jump.mp3?" + new Date().getTime());
jumpM.importance = "high";
const startM = new Audio("game/sound/start.mp3?" + new Date().getTime());
startM.importance = "high";
const failM = new Audio("game/sound/fail.mp3?" + new Date().getTime());
failM.importance = "high";
</script>
<style>
#loader {
border: 6px solid #f3f3f3;
border-radius: 50%;
border-top: 6px solid #444444;
width: 40px;
height: 40px;
animation: spin 1s linear infinite;
}
@keyframes spin {
100% {
transform: rotate(360deg);
}
}
.spinner_loader {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
</style>
<link rel="icon" href="icon.png">
<title>ColbaKing</title>
<script>
document.onreadystatechange = function() {
if (document.readyState !== "complete") {
document.querySelector(
"body").style.visibility = "hidden";
document.querySelector(
"#loader").style.visibility = "visible";
} else {
setTimeout(function(){
document.querySelector(
"#loader").style.display = "none";
document.querySelector(
"body").style.visibility = "visible";
},200);
}
};
</script>
</head>
<body>
<!-- loader animation -->
<div class="spinner_loader" id = "loader"></div>
<div class="bodybox">
<br><br>
<h1>COLBAKING</h1>
<br>
<p1>Tap the box and help colbaKing to escape from the ghosts (Don't ask why is he chased by those
ghosts, anyway). Ignore your gut feeling if it frequently tells you that it's a clone of Chrome's dino-game .. <br><br>Tip : Tap to jump<br>
(Special tip for computer browsers : Tap spacebar (or 'W') to jump and tap 'H' to make the King happy :) </p1>
<br><br>
<canvas id="game"></canvas>
</div>
<script src='game/main.js' defer></script>
<br><br><br>
<footer style="font-size: 0.75rem;">
<center>
🄯colbaking v1.1
<br>
author : <a href="https://github.com/bruttazz/" target="_blank" style="color:#000000; text-decoration: none;">@bRuttaZz</a>
</center>
</footer>
</body>
</html>