lecture 8: examples

Help and advice on JavaScript can come from any of the following sources, all of which are listed on your handout as well:

• http://javascript.internet.com/ The JavaScript Source - Hundreds of Scripts
• http://www.webreference.com/javascript/ Webreference.com's JavaScript tip of the week
• http://www.javascriptmall.com/learn/ The JavaScript Learning Centre
• http://www.pageresource.com/jscript/ A links page of JS tutorials.

At these sites (especially the JavaScript source) you can pick up ready-made scripts. These are usually easy to use, though having some understanding of the basic principles introduced on the last slide will be a help with some of the more difficult ones. Here's a relatively simple one:

Color Picker

Click a box and the hexadecimal color will be shown below

.

There are 216 boxes on that chart (they're all the web-safe colours) but they all call the same simple JavaScript function which looks like this:

function showColor(val) { document.colorform.hexval.value = val; }

And an example of how to call it:

<area shape="rect" coords="257,56,263,65" href="javascript:showColor('#FF0066')" />

The argument "#FF0066" is therefore passed to the function showColor where it is referred to as val. This value is then assigned to the textbox called hexval in the form called colorform in the current document. And that's how it works. All the bold words in this paragraph are user-defined names. If still confused, maybe have a look at the source code for this page.