Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

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

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 Course 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. Estimated timed 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 Course 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 sentence I Love JavaScript to be displayed as an h3 heading just below the button. 2. ____/10 Add a paragraph saying "Click the text! When the mouse button is pressed down, the text will change colour" where the text colour starts alternating between red and green using onmousedown and onmouseup events. This is a w3schools Mouse Event example. 3. ____/10 Add a paragraph saying "JavaScript can change font style!" and cause the font size, colour and font family to change when a button called "Try it Now" 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. The link included in class lecture notes 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 this page (http://www2.cs.uregina.ca/~samei20r/cs100/winter16/notes/javascript/ja vascript5.html) so that you can enter your first and last names and click the submit button to display the message Firstname Lastname is really glad to finish building web pages and adding interactive elements to them! Firstname and Lastname are place holders for where your first and last names will appear.

Step by Step Solution

There are 3 Steps involved in it

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image_2

Step: 3

blur-text-image_3

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

Databases And Information Systems 1 International Baltic Conference Dbandis 2020 Tallinn Estonia June 19 2020 Proceedings

Authors: Tarmo Robal ,Hele-Mai Haav ,Jaan Penjam ,Raimundas Matulevicius

1st Edition

303057671X, 978-3030576714

More Books

Students also viewed these Databases questions

Question

Be familiar with the integrative servicescape model.

Answered: 1 week ago

Question

Understand the role of corporate design in communications.

Answered: 1 week ago