Menu_ID25 - Another Rollover

Far too many of my visitors have asked me How did I do the text roll over Menu on my Home Page. First of all - those are not Texts in that sense - those are Text Images (as in this example). Point is, it's a JavaScript Rollover (not DHTML) & can handle Images only. Plus, I was under the impression, one of my earlier scripts (Reflections) is very similar, so possibly, one could modify that. It seems, many would prefer to have it modified by me. So, in order to make my own task easier - here it is!

So what does it do?

There are as usual two Event Handlers, ie "onmouseover" and "onmouseout" which relates to two Function calls, namely "swapover" and "swapout". The difference from the usual Rollover scripts is that this does not rollover itself - instead, changes another image somewhere else.

Obvious question is how does the script know which image to pull up on mouseover which link. Here's what we need to do.

In this example, there are in all Four Rollover Images (One Default plus 3 other for each link). I have named them "des1 .. des4". What you call them is un-important (Des being abbreviation of Description in this case) - so long they are identical except for the NUMERICAL suffixes increasing by 1.
Then we create a table, place the Link images in one column & the default Image in another. (They can be in Rows as in my Family Home Page OR for that matter in another table some where else in the Page....)
The script (function SWAPOUT) specifies that the default image remains visible on all mouseout events.
Onmouseover the SWAPOVER function evaluates whether the mouse is over des2, des3 or des4 image names as included within each of the "a" tags & rolls over the corresponding image.

That's all there is to it!

Only thing to remember is that the RollOver Images MUST be of same size.