diff --git a/Number Guessing Game/NumberGuessingGame.html b/Number Guessing Game/NumberGuessingGame.html
new file mode 100644
index 0000000..8f81470
--- /dev/null
+++ b/Number Guessing Game/NumberGuessingGame.html
@@ -0,0 +1,28 @@
+
+
+
+
+
+
+ Number Guessing Game
+
+
+
+
Number Guessing Game
+
Guess a number between 1 and 100
+
Total Score: 0
+
Current Round Score: 10
+
Guess a number:
+
+
Submit Guess
+
+
+
+
+
+
Start New Game
+
Guess a number between 1 and 100. The slider indicates how close you are to the correct number - red is hot (close) and blue is cold (far).
+
+
+
+
diff --git a/Number Guessing Game/script.js b/Number Guessing Game/script.js
new file mode 100644
index 0000000..bf791c8
--- /dev/null
+++ b/Number Guessing Game/script.js
@@ -0,0 +1,91 @@
+let randomNumber = Math.floor(Math.random() * 100) + 1;
+
+let guessSubmit = document.querySelector('#submitGuess');
+let guessField = document.querySelector('#guessField');
+let resultContainer = document.querySelector('#resultContainer');
+let timerContainer = document.querySelector('#timerContainer');
+let resetButton = document.querySelector('#resetButton');
+let totalScoreContainer = document.querySelector('#totalScoreContainer'); // Reference to the new total score container
+let myRange = document.querySelector('#myRange');
+
+
+let guessCount = 1;
+let totalScore = 0;
+let timer;
+
+let roundScoreContainer = document.querySelector('#roundScoreContainer'); // Element to display current round's score
+let score = 10; // Maximum score for each round
+
+function checkGuess() {
+ let userGuess = Number(guessField.value);
+ if (userGuess === randomNumber) {
+ displayMessage('Congratulations! You got it right!', 'green');
+ totalScore += score; // Add the remaining points to the total score
+ totalScoreContainer.textContent = 'Total Score: ' + totalScore; // Update total score on screen
+ roundScoreContainer.textContent = ''; // Clear round score
+ endGame();
+ } else {
+ if (score > 1) { // Only subtract a point if there are points left
+ score--; // Subtract one point for an incorrect guess
+ roundScoreContainer.textContent = 'Current Round Score: ' + score; // Update round score on screen
+ }
+ if (userGuess < randomNumber) {
+ displayMessage('Last guess was too low!', 'red');
+ } else if(userGuess > randomNumber) {
+ displayMessage('Last guess was too high!', 'red');
+ }
+ }
+ let sliderValue = 100 - Math.abs(userGuess - randomNumber);
+ myRange.value = sliderValue;
+
+ guessCount++;
+ guessField.value = '';
+ guessField.focus();
+}
+
+guessSubmit.addEventListener('click', checkGuess);
+
+function displayMessage(msg, color) {
+ resultContainer.textContent = msg;
+ resultContainer.style.color = color;
+ }
+
+function endGame() {
+ guessField.disabled = true;
+ guessSubmit.disabled = true;
+ resetButton.classList.remove('hidden'); // Show the button by removing 'hidden' class
+ clearInterval(timer);
+ }
+
+ resetButton.addEventListener('click', resetGame);
+
+function resetGame() {
+ guessCount = 1;
+ score = 10; // Reset the score for the new round
+ roundScoreContainer.textContent = 'Current Round Score: ' + score; // Display initial score for new round
+ guessField.disabled = false;
+ guessSubmit.disabled = false;
+ guessField.value = '';
+ guessField.focus();
+ resetButton.classList.add('hidden'); // Hide the button by adding 'hidden' class
+ resultContainer.textContent = '';
+ timerContainer.textContent = '';
+ randomNumber = Math.floor(Math.random() * 100) + 1;
+ startTimer();
+ }
+
+function startTimer() {
+ let time = 60; // 60 seconds
+ timer = setInterval(function() {
+ if (time <= 0) {
+ clearInterval(timer);
+ displayMessage('Time is up! Try again.', 'red');
+ endGame();
+ } else {
+ timerContainer.textContent = `Remaining time: ${time} seconds`;
+ time--;
+ }
+ }, 1000);
+ }
+
+startTimer();
diff --git a/Number Guessing Game/style.css b/Number Guessing Game/style.css
new file mode 100644
index 0000000..2c2a39c
--- /dev/null
+++ b/Number Guessing Game/style.css
@@ -0,0 +1,119 @@
+@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
+
+body {
+ background-color: #000;
+ font-family: 'Poppins', sans-serif;
+ margin: 0;
+ padding: 0;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100vh;
+ color: #fff;
+}
+
+#gameContainer {
+ background: linear-gradient(135deg, #202020 0%, #0b0b0b 100%);
+ padding: 20px;
+ border-radius: 15px;
+ box-shadow: 0px 0px 15px 0px rgba(255,255,255,0.1);
+ text-align: center;
+ max-width: 500px;
+ width: 90%;
+ animation: fadeIn 0.5s ease-in-out;
+}
+
+@keyframes fadeIn {
+ from {opacity: 0;}
+ to {opacity: 1;}
+}
+
+#guessField {
+ margin-top: 20px;
+ padding: 10px;
+ font-size: 16px;
+ background-color: #fff;
+ color: #000;
+ border: none;
+ border-radius: 30px;
+ width: 80%;
+}
+
+#submitGuess, #resetButton {
+ margin-top: 20px;
+ padding: 10px 20px;
+ font-size: 16px;
+ background-color: #000;
+ color: #fff;
+ border: none;
+ border-radius: 15px;
+ cursor: pointer;
+ transition: all 0.3s ease;
+ box-shadow: 0px 5px 15px 0px rgba(0,0,0,0.2);
+ width: 100%;
+}
+
+#submitGuess:hover, #resetButton:hover {
+ background-color: #fff;
+ color: #000;
+ box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.2);
+}
+
+#resultContainer {
+ margin-top: 20px;
+ padding: 10px;
+ font-size: 18px;
+ color: #fff;
+}
+
+/* Responsive Design */
+@media (max-width: 500px) {
+ body {
+ font-size: 16px;
+ }
+
+ #guessField {
+ font-size: 14px;
+ }
+
+ #submitGuess, #resetButton {
+ font-size: 14px;
+ }
+}
+
+.hidden {
+ display: none;
+}
+
+
+.slider {
+ -webkit-appearance: none;
+ appearance: none;
+ margin-top: 20px;
+ width: 100%;
+ height: 15px;
+ border-radius: 5px;
+ background: linear-gradient(to right, blue, red);
+ outline: none;
+ opacity: 0.7;
+ -webkit-transition: .2s;
+ transition: opacity .2s;
+}
+
+.slider::-webkit-slider-thumb {
+ -webkit-appearance: none;
+ appearance: none;
+ width: 25px;
+ height: 25px;
+ border-radius: 50%;
+ background: #8a8a8a;
+ cursor: pointer;
+}
+
+
+#infoText {
+ color: gray;
+ font-size: 14px;
+ margin-top: 20px;
+ text-align: center;
+}
diff --git a/index.html b/index.html
index 0588818..82c1a52 100644
--- a/index.html
+++ b/index.html
@@ -74,6 +74,10 @@ Last Played: None
In Painting Game, paint the canvas by dragging your mouse across the screen. Its simple really, but you can create some pretty cool art!
+ Number Guessing Game
+
+ In Number Guessing Game, your objective is to guess a secret number between 1 and 100. your score decreases with each incorrect guess. Try to get the highest score possible!
+