Javascript

Object orientated programing and Javascript are not as hard as the names imply: looking at the mouse over event for an image (an example of an object) and a script that changes a property of that image - illustrates how difficult it can sometimes not be. But you need to work with HTML code directly.

This code [onmouseover="Javascript:example.border='1'"] changes the border of "example" to 1, in other words puts a box around it which is the normal way a click able graphic is displayed. The example element was defined by [id="example"]. [onmouseout ="Javascript:example.border='0'"] changes it back, when the mouse moves away.

Example:


Example 1 1/2

When dealing with scripts that for whatever reason are going to take many lines; it is easier to build a script in a script tag. In this example the opacity of the image is changed, Internet Explorer allows this to be done one way but Mozilla (and those browsers build on that engine: Firefox) have different ways to allow this property or style to be changed.

In this example the image element is being Identified by use the [this] in a javascript function call. It is technically an error to use onmouseover instead of onMouseover, but browsers will forgive this error as show in the first example.


At The Water Cooler