Added dice game code

prathamesh-borse · Oct 4, 2021 · 8d6a0e7 · 8d6a0e7
1 parent 6e86a70
commit 8d6a0e7
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 0 deletions.
diff --git a/Dice Game/index.html b/Dice Game/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="/styles.css" />
+    <title>Dice Game</title>
+  </head>
+  <body>
+    <h1>Refresh Me!</h1>
+    <p>
+      <span class="player1">Player 1 </span>
+      <span class="player2">Player 2</span>
+    </p>
+    <img class="dice1" src="/Images/dice6.png" alt="dice" />
+    <img class="dice2" src="/Images/dice6.png" alt="dice" />
+
+    <script src="/index.js"></script>
+  </body>
+</html>
diff --git a/Dice Game/index.js b/Dice Game/index.js
@@ -0,0 +1,21 @@
+var randomNumber1 = Math.floor(Math.random()*6)+1;            //1 - 6
+var randomDiceImage = "dice" + randomNumber1 + ".png";       // dice1.png - dice6.png
+var randomImageSource = "Images/" + randomDiceImage;        //Images/dice1.png - Imagaes/dice2.png
+var image1 = document.querySelectorAll("img")[0];
+image1.setAttribute("src",randomImageSource);
+
+var randomNumber2 = Math.floor(Math.random()*6)+1;
+var randomDiceImage = "dice" + randomNumber2 + ".png";
+var randomImageSource = "Images/" + randomDiceImage;
+var image2 = document.querySelectorAll("img")[1];
+image2.setAttribute("src", randomImageSource);
+
+if(randomNumber1>randomNumber2){
+    document.querySelector("h1").innerHTML="Player1 wins!🤩";
+}
+else if(randomNumber1<randomNumber2){
+    document.querySelector("h1").innerHTML="Player2 wins!😋";
+}
+else{
+    document.querySelector("h1").innerHTML="Draw!😄";
+}
diff --git a/Dice Game/style.css b/Dice Game/style.css
@@ -0,0 +1,22 @@
+body{
+    text-align: center;
+    background-color: #264653;
+}
+h1{
+    font-size: 8rem;
+    color: white;
+}
+.dice1{
+    padding-right: 40px;
+}
+.dice2{
+    padding-left: 40px;
+}
+.player1{
+    font-size: 2rem;
+    padding-right: 120px;
+}
+.player2{
+    font-size: 2rem;
+    padding-left: 120px;
+}