When it is working, the table project will be jazzed up by learning and applying
something new called a javascript mouse rollover. Javascript is used to create
interactivity and dynamic visual effects on webpages such as image rollovers.
A typical rollover simply switches two images in the same place as your mouse
rolls over the spot.
For each rollover in this exercise, you will need two images saved as appropriate
file types. Each image will be named and placed in a folder. In your <td>
tag or <th> tag, you will place the following.
<a href="link url"
onMouseover="document.rollover name.src='image
url'"
onMouseout="document.rollover name.src='image url'">
<img src="image url" name="rollover
name"></a>
As the web designer you are responsible for giving each rollover a unique
name. A name that can easily be associated with the picture. It is recommended
here to use all lowercase, without spaces and not re-use the name of your
anchors
Fill in the appropriate bold letters with the information needed and (cross
your fingers) your rollovers will work. Below an example of a simple rollover.