Description
In this mini assignment, you will be modifying the HTML page you created for Mini 4 using Java
Script. It does not matter whether you completed Mini 4 fully to answer Mini 5. Alternatively, you
may also use the solution to Mini 4 when it is posted on myCourses as a starting point.
Please do the following:
The web page you created for Mini 4 has a menu bar with the following options: Home, About,
Blog, Contact. Add an additional button, beside Contact, called Colour. The Colour button will
call a JavaScript function called ChangeColour() that will act like a toggle. Your Mini 4 web
page currently displays in a green colour theme. In mini 5, when the user presses the Colour
menu button the green theme will change to a blue theme. You can select the colours for the
blue theme (it is up to you). All the green shades must change to blue shades. When the user
presses the Colour button again, the web page returns to the original green colour theme.
Properly formed CSS will make this task easier.
FOR THE GLORY (optional)
Make the button toggle through ALL the colours that are supported in CSS. You will need to use math
to compute the next colour and then cycle back to the first colour. In other words, each time you press
the Colour menu button a new colour theme is displayed (they do not all need to be pretty).
WHAT TO HAND IN (ZIP all the files)
• A single HTML page called index.html with the JavaScript embedded into the HTML file.
• Your CSS is also embedded in the HTML file
• A README.txt stating which browser you used.
HOW IT WILL BE GRADED
• 20 points: proportionally graded.
◦ +1 Extra menu button “Colour” or “Color”
◦ +4 Properly formatted (syntax and style) JS function ChangeColour()
◦ +5 Properly formatted CSS (minimal code gives higher score)
◦ +10 Properly functioning toggle (green to blue and then blue back to green, repeat)
• No points are awarded for the Glory question. This is only for bragging rights.