A dynamic and interactive quiz application built using HTML, CSS, and JavaScript. This app allows users to test their knowledge by selecting different categories, difficulty levels, and the number of questions. It features a timer, progress bar, and displays the correct answers and scores with animations.
-
Selection of Number of Questions:
- Users can choose how many questions they want to answer in a round.
-
Selection and Display of Category and Difficulty Level:
- Users can select the category and difficulty level of the questions.
- The selected category and difficulty level are displayed during the quiz.
-
Timer for Each Question:
- A timer is displayed for each question.
- When the timer has less than 6 seconds remaining, it starts blinking in red.
-
Progress Bar:
- A visual progress bar fills up as the user answers each question.
- The progress bar has a sliding animation.
-
Current Score Display:
- The current score is displayed and updated as the user answers each question.
-
Display of Correct Answer:
- If a user selects the wrong option, the correct answer is highlighted.
-
End-of-Round Score Display:
- At the end of each round, the current score is displayed with a circular progress bar animation.
-
High Score Display:
- The app keeps track of and displays the highest score achieved by the user.
- Select the number of questions, category, and difficulty level.
- Click "Start" to begin the quiz.
- Answer each question before the timer runs out.
- View your score at the end of the round.
- Try to beat your high score in subsequent rounds.