Dice Game code in html
<!DOCTYPE html>
<html>
<head>
<title>Roll Dice</title>
<style>
#dice {
cursor: pointer;
transition: transform 0.2s;
}
#dice.roll {
transform: rotate(360deg);
}
</style>
</head>
<body>
<h1>Roll Dice</h1>
<img id="dice" src="https://img.freepik.com/premium-photo/white-plastic-dice-white-realistic-game-cube_88211-5834.jpg" alt="Dice" width="200" height="200">
<p id="result"></p>
<script>
document.getElementById("dice").addEventListener("click", function() {
this.classList.add("roll");
setTimeout(function() {
var result = Math.floor(Math.random() * 6) + 1;
document.getElementById("result").innerHTML = "You rolled a " + result;
document.getElementById("dice").classList.remove("roll");
}, 200);
});
</script>
</body>
</html>
Comments
Post a Comment