kunjgit · kunjgit · Jul 5, 2023 · Jun 29, 2023 · Jun 29, 2023 · Jul 5, 2023
diff --git a/Games/reaction_teaser/README.md b/Games/reaction_teaser/README.md
@@ -0,0 +1,23 @@
+# **REACTION TEASER
+
+## **How to play? 🕹️**
+Set up the game.
+Prepare yourself.
+Start the game.
+Pay attention.
+Check your reaction time every time.
+Practice and improve your time.
+Have fun!!!!!!
+
+# =========================BENIFITS/## **Description 📃** 
+===============
+HOW IT BENEFICAL TO YOU?
+Help improve cognitive skills such as attention, focus, and concentration.
+Regularly playing reaction tester games can enhance your reflexes.
+This can help improve your coordination and motor skills.
+It provides a temporary escape from everyday concerns and can help you relax while challenging your mind.
+Repeat or try different games: Once you finish the game or reach your desired goal, you can replay it to beat your previous scores.
+
+## **Screenshots 📸**
+
+[image](../../assets/images/reactionteaser.jpg)
diff --git a/Games/reaction_teaser/images/favicon.jpg b/Games/reaction_teaser/images/favicon.jpg
diff --git a/Games/reaction_teaser/images/reaction.jpg b/Games/reaction_teaser/images/reaction.jpg
diff --git a/Games/reaction_teaser/index.html b/Games/reaction_teaser/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+  <head>
+    <title>reaction teaser</title>
+    <link rel="shortcut icon" href="./images/favicon.jpg" type="image/x-icon">
+    <link rel="stylesheet" href="style.css">
+    <!-- BOOTSTRAP -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link href="https://getbootstrap.com/docs/5.2/assets/css/docs.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
+  </head>
+  <body >
+    <h1 id="jumbotron">TEST YOUR REACTIONS! &nbsp;A DEKSTOP GAME</h1>
+
+
+    <p id="p1" >Click on the boxes and circles as quickly as you can!</p>
+    <p id="bold" >Your Time :<span id="Timetaken"></span></p>
+    <hr>
+    <hr>
+    <div id="shape"></div>
+    <script src="script.js"></script>
+  </body>
+</html>
diff --git a/Games/reaction_teaser/script.js b/Games/reaction_teaser/script.js
@@ -0,0 +1,37 @@
+var start= new Date().getTime();
+      function makeshapeapper(){
+        function getRandomColor() {
+           var letters = '0123456789ABCDEF';
+           var color = '#';
+           for (var i = 0; i < 6; i++) {
+            color += letters[Math.floor(Math.random() * 16)];
+         }
+          return color;
+        }
+        var top=Math.random()*400;
+        var left=Math.random()*400;
+        var width=(Math.random()*200)+100;
+        if(Math.random()> 0.5){
+          document.getElementById("shape").style.borderRadius="50%";
+        }else{
+          document.getElementById("shape").style.borderRadius="0px";
+        }
+        document.getElementById("shape").style.backgroundColor=getRandomColor();
+        document.getElementById("shape").style.top=top+"px";        
+        document.getElementById("shape").style.left=left+"px";       
+        document.getElementById("shape").style.width=width+"px";    
+        document.getElementById("shape").style.display ="block";      
+        start= new Date().getTime();
+      }
+      function appererafterdealy(){
+        setTimeout(makeshapeapper, Math.random()*2000);
+      }
+      appererafterdealy();
+      var start= new Date().getTime();
+      document.getElementById("shape").onclick =function(){
+        document.getElementById("shape").style.display="none";
+       var end= new Date().getTime();
+       var timetaken = (end-start)/1000;
+       document.getElementById("Timetaken").innerHTML=timetaken +"s";
+       appererafterdealy();
+      }
diff --git a/Games/reaction_teaser/style.css b/Games/reaction_teaser/style.css
@@ -0,0 +1,42 @@
+/* *{
+  padding: 0%;
+  margin: 0%;
+} */
+#shape {
+    width:200px;
+    height: 200px;
+    background-color: rebeccapurple;
+    display: none;
+    position: relative;
+
+  }
+  #bold{
+    font-weight: bold;
+    animation: shakeX;
+    font-size: 30px;
+  }
+  body{
+    background-image:url(./images/reaction.jpg)
+
+  }
+  h1{
+    text-align: center;
+
+
+  }
+  #p1{
+    text-align: center;
+    font-style: italic;
+  }
+  #jumbotron {
+    background-color: #e74c3c;
+    animation: bg-color 10s infinite;
+  }
+  @keyframes bg-color {
+    0% { background-color: #e74c3c; }
+    20% { background-color: #f1c40f; }
+    40% { background-color: #1abc9c; }
+    60% { background-color: #3498db; }
+    80% { background-color: #9b59b6; }
+    100% { background-color: #e74c3c; }
+  }
diff --git a/README.md b/README.md
@@ -414,10 +414,7 @@ Also join the discord server for GameZone and start collaborating with others
 | 297 | [Ball_and_glass](https://github.com/kunjgit/GameZone/tree/main/Games/Ball_and_glass)|
 | 298 | [Target_Torrent](https://github.com/kunjgit/GameZone/tree/main/Games/Target_Torrent)|
 | 299 | [Reversi](https://github.com/kunjgit/GameZone/tree/main/Games/Reversi)|  
-
-
-
-
+| 300 | [reaction_teaser](https://github.com/kunjgit/GameZone/pull/2134/files)|
 
 
 

diff --git a/assets/images/reactionteaser.jpg b/assets/images/reactionteaser.jpg