Assignment title: Management


CS100 Winter 2017 Assignment #2 - JavaScript Due: 1:00pm March 17, 2017 You do not attend a lab session during the week of March 13 to March 15, 2017. Instead, please upload your completed Assignment #2 to your Hyperion account by the date and time shown above. As described below, that means that you are updating your original page1.html and placing all of your JavaScript in a file called assign2.js that you will add to your public_html directory. You are to add a set of JavaScript effects to the first page (page1.html) of your existing Assignment #1. If you wish to retain your original page1.html, then you may want to save a copy under a different filename. JavaScript Requirements: The objective of this assignment is to introduce you to the use of JavaScript in adding interactive elements to web pages without getting into the complexities of JavaScript. Consequently, you are being asked to utilize the examples from the Lab Notes and w3schools.com (see http://www.w3schools.com/jsref/dom_obj_event.asp) to add some of the effects seen in those examples to your existing web site. I estimate that the time requirements will be less than the time it took you to add styles to your original assignment. But, be very careful in copying and pasting examples from the Lab Notes or from w3schools.com as simple errors such as a missing brace will not be as easy to spot as was the case when style effects went wrong. Place all of your JavaScript in the single file, assign2.js. To keep this as straightforward as possible, complete all of the requirements (see the mark distribution that follows) using only your page1.html file. You will need to expand your original page1.html to include the elements as described in the following requirements. 1. ____/10 Add a "Click me" button that, when clicked, causes the name and invention year of a historical technology invention to appear as an h3 heading just below the button. 2. ____/10 Add a paragraph saying "Alternating Text Colour" where the text colour starts alternating between red and green using onmousedown and onmouseup events. 3. ____/10 Add a paragraph saying "Watch the Font Change" and cause the font size, colour and font family to change when a button called "Go" is clicked. Choose what you like for the size, colour and font but make it easy for the marker to notice the changes. 4. ____/10 Use onmouseover and onmouseout to expand and contract your home page image from your navigation bar. http://www.w3schools.com/jsref/event_onmouseover.asp takes you to a happy face example that has what you need. If you didn't originally include height and width attributes to control your images, you will need to add them for your home page image. 5. ____/10 Incorporate the example from the bottom of the page http://www2.cs.uregina.ca/~cs100/index.php?page=how_to_do/javapage so that you can enter your first and last names and click the submit button to display the message Firstname Lastname has finished Assignment 2. TOTAL out of _______/50 Student Name: Student Number:Note: • All three assignments must be completed in order to pass CS100. They are required elements of the class. If you fail to submit an assignment, you will not receive a passing grade in the class. • Unlike Assignment #1, the due date and time for Assignment #2 is the same for everyone.