|
CSC 230: The Week beginning Sept. 5 |
|
|
|
CSC 230: The Week beginning Sept. 5 |
|
If you use a source (book or web site), cite your source. (The sites http://whatis.techtarget.com/, http://www.webopedia.com/ and http://www.w3schools.com are decent sources for technical definitions. )
Code
If you want to do a little extra then add the following functionality: clear out the answer when the user changes the bill amount and clear out the answer when the user changes the tip percentage. (For a hint see EventDemo.)
(Note that HTML5 supports new input types such as type="number", see http://www.w3schools.com/html5/html5_form_input_types.asp, which could be useful on a page such as this restaurant calculator page.)
Look at the example program Magritte.htm and the example code at http://www.w3schools.com/tags/tag_select.asp and http://www.w3schools.com/jsref/event_onchange.asp. Then pick out a few youtube videos and make a page that adapts the above code to have a user select a video title from a drop-down select and have the video embedded on your page.
The onmouseover and onmouseout eventsLook at the code found at http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onmouseover, then adapt it as follows: have one <img> element but two possible image files; one image file will serve as the default source whereas the second image file will be used when the user placed the mouse over the image. When the user's mouse is no longer over the image the source file should revert back to the default.
The onfocus and onblur eventsLook at the code found at
http://www.w3schools.com/jsref/event_onfocus.asp
and
http://www.w3schools.com/jsref/event_onblur.asp.
Then make a page with two text inputs, use the onfocus and onblur events and code like the following
document.getElementById("txtInput1").style.backgroundColor="#ffff99";
that changes the color of a text input. Make your page so that when the user puts the cursor in a
textbox that it changes color and when the user puts the cursor elsewhere the textbox changes
back to some default color.
(You might also want to look at
http://www.w3schools.com/html/html_colors.asp
)
Look at the code http://www.w3schools.com/jsref/event_onload.asp. Look at the examples on using the body's onload (near the top) and an image's onload (near the bottom). Make a page with an image with an onload and a body onload -- each function should have an alert. It can be used to determine which event (page load or image load) happens first.