background Normal & Normal++ beda(brightness,opacity)
This commit is contained in:
parent
4e82f469c6
commit
c5e65f7b53
19
GameLogic.js
19
GameLogic.js
@ -66,15 +66,22 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
//buat ngatur batu spwan apa ga nanti
|
//buat ngatur batu spwan apa ga nanti
|
||||||
document
|
const halaman = document.querySelector(".HalamanFull");
|
||||||
.getElementById("mode-normal")
|
const gameCanvas = document.getElementById("game");
|
||||||
.addEventListener("click", function () {
|
|
||||||
|
document.getElementById("mode-normal").addEventListener("click", function () {
|
||||||
|
halaman.style.backgroundImage ='url("halamanFull/cherryBlossom.png")';
|
||||||
|
halaman.style.setProperty("--overlay-opacity", "0.4");
|
||||||
|
gameCanvas.style.filter = "brightness(1)";
|
||||||
|
|
||||||
StartingGame(false);
|
StartingGame(false);
|
||||||
});
|
});
|
||||||
|
|
||||||
document
|
document.getElementById("mode-tambahan").addEventListener("click", function () {
|
||||||
.getElementById("mode-tambahan")
|
halaman.style.backgroundImage ='url("halamanFull/cherryBlossomNight.png")';
|
||||||
.addEventListener("click", function () {
|
halaman.style.setProperty("--overlay-opacity", "0.7");
|
||||||
|
gameCanvas.style.filter = "brightness(0.5)";
|
||||||
|
|
||||||
StartingGame(true);
|
StartingGame(true);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@ -40,7 +40,8 @@
|
|||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
inset: 0;
|
inset: 0;
|
||||||
background: rgba(0,0,0,0.4); /* 0.4 = opacity overlay */
|
background: rgba(0,0,0, var(-- overlay-opacity, 0.4)); /* 0.4 = opacity overlay */
|
||||||
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
.starting {
|
.starting {
|
||||||
border: 2px solid pink;
|
border: 2px solid pink;
|
||||||
@ -159,10 +160,6 @@
|
|||||||
font-optical-sizing: auto;
|
font-optical-sizing: auto;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
background-image: url("gameOver/gameOver.png");
|
|
||||||
background-size: 100% 100%;
|
|
||||||
background-position: center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
}
|
}
|
||||||
#mode-normal {
|
#mode-normal {
|
||||||
background-color: #73e4c2;
|
background-color: #73e4c2;
|
||||||
|
|||||||
@ -22,7 +22,7 @@
|
|||||||
<div class="HalamanFull">
|
<div class="HalamanFull">
|
||||||
<canvas width="1056" height="480" id="game"></canvas>
|
<canvas width="1056" height="480" id="game"></canvas>
|
||||||
<div id="gameover-overlay" class="starting" style="display: none">
|
<div id="gameover-overlay" class="starting" style="display: none">
|
||||||
<div class="popAwal">
|
<div class="popAwal1">
|
||||||
<h1 style="color: red" id="gameover-title">YOU DIED</h1>
|
<h1 style="color: red" id="gameover-title">YOU DIED</h1>
|
||||||
<p id="gameover-score">Score: 0</p>
|
<p id="gameover-score">Score: 0</p>
|
||||||
<button id="ulangi" class="modegame">Main lagi?</button>
|
<button id="ulangi" class="modegame">Main lagi?</button>
|
||||||
|
|||||||
BIN
halamanFull/cherryBlossomNight.png
Normal file
BIN
halamanFull/cherryBlossomNight.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.4 MiB |
Loading…
x
Reference in New Issue
Block a user