DICE-GAME-HTML-CSS-JS-

a small project to implement js :)

<title>Dicee</title>

Refresh Me

Player 1

Player 2

<script src="index.js" charset="utf-8"></script> THANK YOU

<-----------------------------------------------------------------***********************************************************----------------------------------------------------------->

CSS->

.container { width: 70%; margin: auto; text-align: center; }

.dice { text-align: center; display: inline-block;

}

body { background-color: #393E46; }

h1 { margin: 30px; font-family: 'Lobster', cursive; text-shadow: 5px 0 #232931; font-size: 8rem; color: #4ECCA3; }

p { font-size: 2rem; color: #4ECCA3; font-family: 'Indie Flower', cursive; }

img { width: 80%; }

footer { margin-top: 5%; color: #EEEEEE; text-align: center; font-family: 'Indie Flower', cursive;

}

---------------------------------------------------**************************************************************_____________________________________ JAVASCRIPT->

var randomNumber1 = Math.floor(Math.random() * 6) + 1; //1-6

var randomDiceImage = "dice" + randomNumber1 + ".png"; //dice1.png - dice6.png

var randomImageSource = "C:\Users\ASUS\Downloads\Dicee Challenge - Completed" + randomDiceImage; //images/dice1.png - images/dice6.png

var image1 = document.querySelectorAll("img")[0];

image1.setAttribute("src", randomImageSource);

var randomNumber2 = Math.floor(Math.random() * 6) + 1;

var randomImageSource2 = "C:\Users\ASUS\Downloads\Dicee Challenge - Completed" + randomNumber2 + ".png";

document.querySelectorAll("img")[1].setAttribute("src", randomImageSource2);

//If player 1 wins if (randomNumber1 > randomNumber2) { document.querySelector("h1").innerHTML = "🚩 Play 1 Wins!"; } else if (randomNumber2 > randomNumber1) { document.querySelector("h1").innerHTML = "Player 2 Wins! 🚩"; } else { document.querySelector("h1").innerHTML = "Draw!"; }