Juste Prix

Description :

This project consists of an interactive “Price is Right” game developed with HTML, CSS and JavaScript. The player must guess a random prize between 1 and 100.

Main features :

1. User interface :

- A responsive interface with an input field and a button to validate the guess.

- Dynamic message display (“UP”, “DOWN”, “WON!”) to guide the player.

2. Game mechanics :

- Random generation of a target price between 1 and 100 using a JavaScript function.

- Verification of user input, with the following cases handled:

- If the price is correct: display of “WON!

- If the estimate is too low: display of “HIGHER”.

- If the estimate is too high: display of “LOWER”.

- If input is invalid or out of range: error message.

3. Event management :

- Validation by clicking on the button or pressing the Enter key for a smooth experience.

- Automatic reset of input field after each attempt.

4. Design :

- Use of modern CSS (flexbox, media queries) for a centered, responsive layout.

- Retro font (“Pixelify Sans”) for a playful look.

- Visual animation on button hover.

5. Adaptability :

- Behavior optimized for small screens (smartphones), with adjusted dimensions and adapted colors.

Technical details :

- JavaScript :

- Use of a random generation function to define the target price.

- Addition of event listeners (`addEventListener`) to capture clicks and keystrokes.

- Dynamic DOM manipulation to display results and guide the user.

- CSS :

- Responsive design with media queries for compatibility on various devices.

- Modern styles, with dynamic shadows and colors for attractive rendering.