Duck_Hunt_Game is added

README.md

@@ -257,6 +257,9 @@ ________________________________________________________________________________
 |  200   | [City_Builder_Game](.SinglePlayer%20-%20Games/City_Builder_Game) |
 |  201   | [Cooking_Challenge Game](.SinglePlayer%20-%20Games/Cooking_Challenge Game) |
 |  202   | [Doodling_Game](.SinglePlayer%20-%20Games/Doodling_Game) |
+|  203   | [Duck_Hunt_Game](.SinglePlayer%20-%20Games/Duck_Hunt_Game) |
+
+
 
 
 

SinglePlayer - Games/Duck_Hunt_Game/README.md

@@ -0,0 +1,41 @@
+# **Duck_Hunting_Game** 
+
+---
+
+<br>
+
+## **Description 📃**
+
+It is a game where various flying ducks will come on screen at the interval of a few seconds. We have to shoot them by a gun pointer which is cursor here by single a click on the duck. On every shoot, our score will be increased by one .If we have hunted a minimum of 10 ducks with total score of 10 then we will win the game.
+- 
+
+## **Functionalities 🎮**
+
+->A button named "Click here to start" on the home screen will start the game.
+-> Flying ducks will come on the screen at the time interval of few seconds.
+-> Cursor will act as gun pointer at ducks.
+-> On single click over the duck will increase your score as the duck is killed.
+-> As soon as your score will be 10, you will win the game and a "Congrats" will appear along with a button named "Restart". 
+-> On clicking on "Restart" button will redirect to home page where you can again play the game by clicking on butoon "Click here to start".
+
+- 
+<br>
+
+## **How to play? 🕹️**
+
+-> After clicking on "Click here to start" button on home page, it will start the game.
+-> Where flying birds will move on screen.
+-> You cusor will act as gun pointer.
+-> You have to aim each duck by the cursor and single click to kill them.
+-> To play the game again-
+    Restart -> Click here to play
+
+<br>
+
+## **Screenshots 📸**
+
+<br>
+
+[image](../../assets/images/Duck_Hunting_Game.png)
+
+<br>

SinglePlayer - Games/Duck_Hunt_Game/design.css

@@ -0,0 +1,199 @@
+body{
+    margin: 0;
+    padding:0;
+    cursor: crosshair;
+    background-image: url('other_files/bg.jpg');
+    overflow: hidden;
+    content:'';
+    display: block;
+    position:100%;
+    width:100%;
+    height:40000px;
+    z-index: index 0;
+
+
+
+
+}
+
+
+
+
+@keyframes duckfly{
+    0%{
+        left:150%;
+        top:10%;
+    }
+    25%{
+        left:80%;
+        top:50%;
+    }
+
+    50%{
+        left:50%;
+        top:30%;
+    }
+
+
+    75%{
+        left:40%;
+        top:30%;
+    }
+    80%{
+        left:20%;
+        top:50%;
+    }
+
+    100%{
+        left:-50%;
+        top:10%;
+    }
+
+
+
+
+
+
+}
+
+
+input+label{
+    position:absolute;
+    left:-10px;
+    z-index: 2;
+    width: 25px;
+    height: 25px;
+    display:block;
+    z-index:5;
+    transform: translate(-50%,-50%);
+    background-image: url('other_files/duck.jpeg') ;
+    background-repeat: no-repeat;
+    border-radius: 50%;
+
+
+}
+
+input:checked+label{
+    opacity: 0;
+    transition: 0.5s;
+    transform: rotate(120deg);
+    transform-origin: 60%;
+    z-index: 5;
+}
+
+.duck:nth-last-of-type(1)
+{
+    animation:duckfly 10s linear 1s infinite;
+    cursor: crosshair;
+
+}
+.duck:nth-last-of-type(2)
+{
+    animation:duckfly 10s linear 2s infinite;
+    cursor: crosshair;
+}
+.duck:nth-last-of-type(3)
+{
+    animation:duckfly 10s linear 3s infinite;
+    cursor: crosshair;
+}
+.duck:nth-last-of-type(4)
+{
+    animation:duckfly 10s linear 4s infinite;
+    cursor: crosshair;
+}
+.duck:nth-last-of-type(5)
+{
+    animation:duckfly 10s linear 5s infinite;
+    cursor: crosshair;
+}
+.duck:nth-last-of-type(6)
+{
+    animation:duckfly 10s linear 6s infinite;
+    cursor: crosshair;
+
+}
+.duck:nth-last-of-type(7)
+{
+    animation:duckfly 10s linear 7s infinite;
+    cursor: crosshair;
+}
+.duck:nth-last-of-type(8)
+{
+    animation:duckfly 10s linear 8s infinite;
+    cursor: crosshair;
+}
+.duck:nth-last-of-type(9)
+{
+    animation:duckfly 10s linear 9s infinite;
+    cursor: crosshair;
+}
+.duck:nth-last-of-type(10)
+{
+    animation:duckfly 10s linear 10s infinite;
+    cursor: crosshair;
+}
+.score
+{
+    position: absolute;
+    bottom: 5px;
+    height: 50px;
+    line-height: 50px;
+
+    width: 30%;
+    z-index: 2;
+    text-align: center;
+    font-size: 30px;
+    font-weight: bold;
+}
+.score:after{
+    content: counter(score);
+    display: inline-block;
+
+}
+.score:before{
+    content:'Score';
+    display: inline-block;
+    margin-right: 10px;
+}
+
+input:checked{
+    counter-increment: score;
+}
+
+.win{
+    font-family:fantasy;
+
+    text-align: center;
+    color: yellow;
+    padding-top: 10px;
+    font-size:50px;
+    text-shadow: 0 0 5px rgb(121, 59, 101),
+                 0 0 10px rgb(139, 198, 232), 
+                 0 0 20px rgb(139, 198, 232), 
+                 0 0 30px rgb(139, 198, 232), 
+                 0 0 40px rgb(143, 223, 107), 
+                 0 0 55px rgb(143, 223, 107), 
+                 0 0 70px rgb(223, 215, 107)
+}
+
+.start{
+    font-family:serif;
+
+    text-align: center;
+    color: #65d5dd;
+    padding-top: 10px;
+    font-size:60px;
+    text-shadow: 0 0 5px rgb(121, 59, 101),
+                 0 0 10px rgb(139, 198, 232), 
+                 0 0 20px rgb(139, 198, 232), 
+                 0 0 30px rgb(139, 198, 232), 
+                 0 0 40px rgb(143, 223, 107), 
+                 0 0 55px rgb(143, 223, 107), 
+                 0 0 70px rgb(223, 215, 107)
+
+}
+input.boxsize{
+    height: 0px;
+    width: 0px;
+}

SinglePlayer - Games/Duck_Hunt_Game/other_files/game.html

@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width, initial-scale=1.0">
+    <title>Game</title>
+    <link rel="stylesheet" href="../design.css">
+</head>
+<body onclick="document.getElementById('sound').play()" >
+
+
+    <audio id="sound" src="sh.mp3" preload="auto"></audio>
+    <input type="checkbox" id="duck1" onclick="fun()" class="boxsize">
+    <label for="duck1" class="duck"></label>
+
+    <input type="checkbox" id="duck2" onclick="fun()"  class="boxsize">
+    <label for="duck2" class="duck"></label>
+
+    <input type="checkbox" id="duck3" onclick="fun()" class="boxsize">
+    <label for="duck3" class="duck"></label>
+
+    <input type="checkbox" id="duck4" onclick="fun()"  class="boxsize">
+    <label for="duck4" class="duck"></label>
+
+    <input type="checkbox" id="duck5" onclick="fun()"  class="boxsize">
+    <label for="duck5" class="duck"></label>
+
+    <input type="checkbox" id="duck6" onclick="fun()"  class="boxsize">
+    <label for="duck6" class="duck"></label>
+
+    <input type="checkbox" id="duck7" onclick="fun()"  class="boxsize">
+    <label for="duck7" class="duck"></label>
+
+    <input type="checkbox" id="duck8" onclick="fun()" class="boxsize">
+    <label for="duck8" class="duck"></label>
+
+    <input type="checkbox" id="duck9" onclick="fun()" class="boxsize">
+    <label for="duck9" class="duck"></label>
+
+    <input type="checkbox" id="duck10" onclick="fun()" class="boxsize">
+    <label for="duck10" class="duck"></label>
+
+
+</body>
+<div class="score"></div>
+
+<script>
+    let a=0;
+    function fun(){
+        a++;
+        if (a==10){
+            window.location.replace("win.html");
+        }
+
+    }
+
+</script>
+
+
+</body>
+</html>

SinglePlayer - Games/Duck_Hunt_Game/other_files/win.html

@@ -0,0 +1,23 @@
+<!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="../design.css">
+    <title>won</title>
+</head>
+<body>
+    <div class="win">Congrats!!<br>
+        You Won..<br>
+        <button onclick="pre()">Restart</button>
+    </div>
+    <script>
+    function pre(){
+        window.location.replace("../start.html")
+
+    } 
+    </script>
+
+</body>
+</html>

SinglePlayer - Games/Duck_Hunt_Game/start.html

@@ -0,0 +1,28 @@
+<!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="design.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />
+    <title>Duck_hunting_game</title>
+
+</head>
+<body>
+    <div style="text-align: left; margin-left: 40px;
+  margin-top: 10px;
+  font-size: 30px; "><a href="https://kunjgit.github.io/GameZone/"><i style="color:black;" class="fas fa-home home-icon"></i></a></div>
+    <div class="start">Duck Hunting Game<br>
+        <button onclick="start()">Click here to start</button>
+    </div>
+    <script>
+    function start(){
+        window.location.replace("other_files/game.html")
+
+    } 
+    </script>
+
+</body>
+</html>
+