This repository contains a collection of small JavaScript projects. Each project is designed to demonstrate a specific feature or functionality of JavaScript. Below is a brief description of each project.
The Background Color Changer allows the user to change the background color of the webpage by clicking a button. This project demonstrates the use of JavaScript to manipulate the DOM and apply CSS styles dynamically.
- Randomly change the background color.
- Display the current color code.
- Change the color code by clicking on the same color box.
The BMI Calculator calculates the Body Mass Index (BMI) based on the user's input of height and weight. This project showcases the use of JavaScript for basic arithmetic operations and form handling.
- Input fields for height and weight.
- Calculate and display the BMI.
- Provide a health status based on the BMI value.
The Digital Clock displays the current time in hours, minutes, and seconds. This project highlights the use of JavaScript's Date object and the setInterval function to update the time every second.
- Display current time in HH:MM:SS format.
- Update time every second.
The Guess The Number game generates a random number between 1 and 100, and the player has 10 attempts to guess the correct number. This project illustrates the use of event listeners, conditionals, and DOM manipulation in JavaScript.
- Input field for the player's guess.
- Display previous guesses.
- Provide feedback if the guess is too high or too low.
- Track the number of remaining attempts.
- Display a message when the game is won or lost.
The 3 HTML files contain practice code for setTimeOut and Event listeners.
The Background Color Changer changes the background color of the webpage every second when the "Start" button is clicked and stops changing when the "Stop" button is clicked. This project demonstrates the use of JavaScript's setInterval and clearInterval functions, as well as DOM manipulation.
- Changes background color every second when started.
- Stops changing background color when stopped.
The Event KeyCodes project displays the key, key code, and code of a pressed key. This project demonstrates the use of JavaScript's keydown event and how to capture and display key event information.
- Displays the key pressed.
- Displays the key code.
- Displays the code.
- Inspired by Chai and Code