You are on page 1of 1

<!

DOCTYPE html>
<html>
<head>
<title>Permainan Slot</title>
<style>
.slot-container {
display: flex;
justify-content: center;
align-items: center;
height: 200px;
font-size: 48px;
}
</style>
</head>
<body>
<h1>Permainan Slot</h1>
<div class="slot-container">
<div id="slot1">-</div>
<div id="slot2">-</div>
<div id="slot3">-</div>
</div>
<button onclick="startSlot()">Putar</button>

<script>
const symbols = ['🍒', '🍊', '🍇', '🔔', '💎'];
const slot1 = document.getElementById('slot1');
const slot2 = document.getElementById('slot2');
const slot3 = document.getElementById('slot3');

function getRandomSymbol() {
return symbols[Math.floor(Math.random() * symbols.length)];
}

function startSlot() {
const interval = setInterval(() => {
slot1.textContent = getRandomSymbol();
slot2.textContent = getRandomSymbol();
slot3.textContent = getRandomSymbol();
}, 100);

setTimeout(() => {
clearInterval(interval);
checkResult();
}, 3000);
}

function checkResult() {
if (slot1.textContent === slot2.textContent && slot2.textContent ===
slot3.textContent) {
alert('Selamat! Anda menang!');
} else {
alert('Maaf, Anda kalah. Coba lagi!');
}
}
</script>
</body>
</html>

You might also like