Calculator Tools Calculator Tools
Create

Fun Slot Machine Game

Nov 12, 2023

About this app

A fun slot machine game with 45 buttons, each with a unique number.

Fun Slot Machine Game 🎰 🎰 🎰

Related apps

Put this on your site

Source

                    <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">

<title>Fun Slot Machine Game</title>
<meta name="description" content="A fun slot machine game with 45 buttons, each with a unique number.">
<meta name="keywords" content="game, slot machine, fun, interactive">

<style>
body {
background: linear-gradient(to right, #ff9966, #ff5e62);
font-family: 'Pacifico', cursive;
}

.slot {
font-size: 48px;
margin: 20px;
}

.button {
margin: 5px;
font-size: 20px;
background-color: #FFD700;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
transition-duration: 0.4s;
cursor: pointer;
}

.button:hover {
background-color: #FF4500;
color: white;
}
</style>

<script type="text/javascript">
try {
document.addEventListener("DOMContentLoaded", function() {
for(let i = 1; i <= 45; i++){
let btn = document.createElement("button");
btn.innerHTML = i;
btn.classList.add('button');
btn.onclick = function() { spin(); };
document.getElementById("button-container").appendChild(btn);
}
});

function spin() {
let part1 = Math.floor(Math.random() * 45) + 1;
let part2 = Math.floor(Math.random() * 45) + 1;
let part3 = Math.floor(Math.random() * 45) + 1;

document.getElementById("slot1").innerHTML = part1;
document.getElementById("slot2").innerHTML = part2;
document.getElementById("slot3").innerHTML = part3;
}
} catch (error) {
throw error;
}
</script>

</head>
<body>
<div id="main-container" class="container">
<div id="button-container"></div>
<div id="slots">
<div class="slot" id="slot1">&#x1F3B0;</div>
<div class="slot" id="slot2">&#x1F3B0;</div>
<div class="slot" id="slot3">&#x1F3B0;</div>
</div>
</div>
</body>
</html>