Task 1
1. Modify previous “products.html” document.
2. Prepare one JavaScript function to collect all input and calculate total price.
3. Display total price using a <div (at the bottom of page).
Task 2
1. Apply FIVE (5) different JavaScript Mouse events.
2. Apply FIVE (5) different JavaScript Input events.
3. Apply THREE (3) different JavaScript Load events.
Task 3
1. Prepare new HTML page, save it as “books.html”. This page should have ONE (1) dropdown selection. The dropdown will display a list of authors, and the user can select ONLY ONE author at a time. (You must put at least 3 authors in the dropdown selection).
2. When, the user selects an author, the page will display author’s picture. Put the picture (author’s picture) on the left hand side, below the dropdown created in Task 3.1.
3. If the user selects another author from the dropdown list, the page should understand the changes, and display a picture based on current selection.
4. If the user has selected an author, then change the selection to the first option in dropdown (~Please Select the author~). In this case, the first option in dropdown is not a valid author, then you need to display alert error message and hide all information.
5. Refer to sample image below to help built your code.
Hint: User JavaScript function with parameter.
Task 4
1. Continue from your code in Task 3. Prepare another dropdown selection and include this HTML element after the first dropdown (as created in Task 3.1).
2. The second dropdown will show a list of books written by the author. When the user selected a book from the list, the webpage will display information about the book.
3. Display some information such as the book’s cover page, title, ISBN number and synopsis. Put all the information on the right hand side.
4. For each author, you must include at least THREE (3) different books.
5. For example, if the user selected “J.K. Rowling” from the first dropdown. Then, the user selected “Fantastic Beasts” from the second dropdown. Then relevant image and text related to the book will be displayed on the side. (Use skill learned in Task 2).
