Work

Image Gallery

This project allows users to browse through a series of images displayed as thumbnails. When a thumbnail is clicked, the main image above updates to show the selected picture along with its description. Users can also toggle between a darken/lighten button. Clicking the "Darken" button darkens the image. Click the button below to view the completed project.

Go to Page

Calculator

This project retrieves two input values and an operator. Based on the operator chosen, the function performs the respective mathematical operation and displays the result. I used parseInt() to convert input values into integers for calculations and then updated the HTML element with the calculated result using innerHTML. Click the button below to view the completed project.

Go to Page

Number Game

This project generates a random number between 1 and 100, and users can input their guesses to see if they've guessed correctly. The game keeps track of guess counts and displays feedback (such as "Too high" or "Too low") based on the user's input. If the user guesses the correct number within 10 attempts, they win. Click the button below to view the completed project.

Go to Page

Keyboard Events

In this project, you will see a circle on the canvas that you can control with your keyboard arrow keys. The circle moves around in response to the 'w', 's', 'a', and 'd' keys for up, down, left, and right movements respectively. I used event listeners to detect key presses and update the circle's position accordingly. Click the button below to view the completed project.

Go to Page

Color Changing Buttons

In this project, I created color-changing buttons that dynamically update the background color of my webpage. Each button is linked to a specific color using the data-color attribute. When you click on a button, it triggers a function that retrieves the color value associated with that button and sets it as the background color of the entire webpage. This interactive feature allows you to personalize your browsing experience with a simple click. Click the button below to view the completed project.

Go to Page