Skip to content

Commit c1bc3c1

Browse files
committed
dice game created and added.
1 parent b5a5239 commit c1bc3c1

File tree

9 files changed

+95
-0
lines changed

9 files changed

+95
-0
lines changed

DiceGame/images/dice1.png

2.5 KB
Loading

DiceGame/images/dice2.png

2.16 KB
Loading

DiceGame/images/dice3.png

2.38 KB
Loading

DiceGame/images/dice4.png

2.55 KB
Loading

DiceGame/images/dice5.png

2.76 KB
Loading

DiceGame/images/dice6.png

2.91 KB
Loading

DiceGame/index.html

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<!DOCTYPE html>
2+
<html lang="en" dir="ltr">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Dicee</title>
6+
<link rel="stylesheet" href="styles.css">
7+
<link href="https://fonts.googleapis.com/css?family=Indie+Flower|Lobster" rel="stylesheet">
8+
9+
</head>
10+
<body>
11+
12+
<div class="container">
13+
<h1>Refresh Me</h1>
14+
15+
<div class="dice">
16+
<p>Player 1</p>
17+
<img class="img1" src="images/dice1.png">
18+
</div>
19+
20+
<div class="dice">
21+
<p>Player 2</p>
22+
<img class="img2" src="images/dice2.png">
23+
</div>
24+
25+
</div>
26+
27+
28+
</body>
29+
30+
<footer>
31+
<script src="script.js"></script>
32+
</footer>
33+
</html>

DiceGame/script.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
var randomNo = Math.floor(Math.random()*6)+1;
2+
var randomDiceImage = "images/dice"+randomNo+".png";
3+
4+
var img1 = document.querySelector(".img1").setAttribute("src",randomDiceImage);
5+
// or// var img1 = document.querySelector(".img1").src=`${randomDiceImage}`;
6+
7+
var randomNo2 = Math.floor(Math.random()*6)+1;
8+
var randomDiceImage2 = "images/dice"+randomNo2+".png";
9+
var img2 = document.querySelector(".img2").setAttribute("src",randomDiceImage2);
10+
11+
var winnerDeclaration = document.querySelector("h1");
12+
if(randomNo>randomNo2){
13+
winnerDeclaration.innerHTML="🚩Player 1 is the winner!"
14+
}
15+
else if(randomNo<randomNo2){
16+
winnerDeclaration.innerText="Player 2 is the winner🚩!"
17+
}
18+
else{
19+
winnerDeclaration.innerText="Try again!"
20+
}

DiceGame/styles.css

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
.container {
2+
width: 70%;
3+
margin: auto;
4+
text-align: center;
5+
}
6+
7+
.dice {
8+
text-align: center;
9+
display: inline-block;
10+
11+
}
12+
13+
body {
14+
background-color: #393E46;
15+
}
16+
17+
h1 {
18+
margin: 30px;
19+
font-family: 'Lobster', cursive;
20+
text-shadow: 5px 0 #232931;
21+
font-size: 8rem;
22+
color: #4ECCA3;
23+
}
24+
25+
p {
26+
font-size: 2rem;
27+
color: #4ECCA3;
28+
font-family: 'Indie Flower', cursive;
29+
}
30+
31+
img {
32+
width: 80%;
33+
}
34+
35+
footer {
36+
margin-top: 5%;
37+
color: #EEEEEE;
38+
text-align: center;
39+
font-family: 'Indie Flower', cursive;
40+
41+
}
42+

0 commit comments

Comments
 (0)