Project

Design an online quiz with questions from a topic of your choice. The questions should be chosen from a topic, not just randomly chosen. Use your creativity when selecting a topic.

Quiz questions should be multiple choice, chosen with radio buttons.

Your quiz should include at least five questions. Each question must have its own HTML page. Each question must have at least 3 choices. In addition, you must have an index.html. The index page can be where the 1st question is shown or have an introduction about the quiz that leads to the 1st question. Finally, include a link to go to the next page.

You may be able to provide hints for the questions if requested. Display and hide the hints using the JavaScript innerText. (Optional)

Have the correct answers in a JavaScript file named quiz.js. You only need this file to load everything, including the incorrect answers, correct answers, and hints (if you choose to use them) for each question. It is based on the topics you learned so far in the quarter. This file must be in a folder named js.

Comments in your quiz.js and any CSS rules that trigger backed to the code from your JavaScript stating why you chose the route you did with your code. Example (You are looking are a specific ID in JavaScript. When it's found, you have in CSS would be that block of code for that ID to a different color.

Use images to indicate whether a question is incorrect or correct. Place those images in an img folder.

Choose how the correct answers are displayed. Options are:

After each question is answered.

OR All at once after the quiz is done.

Show a total score for the quiz after all answers are submitted.

Options are:

Points

OR

Percentage

Do not use any other libraries, for example, jQuery or frameworks. Instead, use the vanilla JavaScript we have been using all quarter.

Use a CSS file name style.css to set the layout of your page. Placed the file in a folder named css.

Grading Breakdown:

Functionality:

Source Code Comments in CSS and JavaScript Files:

Layout and Styles (CSS):