| The last set (the Roll Over Set) was done like this:
Before you can actually use the rollover, the following must exist between
your head tags as shown below starting from the
<HEAD> tag below and ending at the
</HEAD> Tag. Change the image name to reflect your images.
To add more images to your menu, just copy the last image tag
setting:
img3on = new Image();
img3on.src = "men2002.jpg"; and change it to reflect a new
setting (also, be sure to change the off sequence too, same as the on, but
put img4off int the appropriate places):
img4on = new Image();
img4on.src = "men2003.jpg";
<HEAD>
<SCRIPT language="JavaScript">
<!--
if (document.images) { //if image object is available
img1on = new Image(); // MouseOver Images
img1on.src = "men2000.jpg";
img2on = new Image();
img2on.src = "men2001.jpg";
img3on = new Image();
img3on.src = "men2002.jpg";
img1off = new Image(); // MouseOut Images
img1off.src = "men1000.jpg";
img2off = new Image();
img2off.src = "men1001.jpg";
img3off = new Image();
img3off.src = "men1002.jpg";
}
function imgOn(imgName) {
if (document.images) {
document[imgName].src = eval(imgName + "on.src"); }}
function imgOff(imgName) {
if (document.images) {
document[imgName].src = eval(imgName + "off.src"); }}
//-->
</SCRIPT>
<TITLE>Please title this page. (Page
1)</TITLE>
</HEAD>
OK, now you can add your menu to your page by inserting the following code
below anywhere you want the menu to appear. Just simply change
http://www.yoururl.com to the desired page URL. And also change the
image names to reflect your images. You must also specify Height and width.
<TABLE CELLSPACING="0" CELLPADDING="0">
<TR> <TD><A href="http://www.yoururl.com"
onmouseover="imgOn('img1')" onmouseout="imgOff('img1')"><IMG name="img1"
border="0" src="men1000.jpg" width="231"
height="47"></A></TD> </TR>
<TR> <TD><A href="http://www.yoururl.com"
onmouseover="imgOn('img2')" onmouseout="imgOff('img2')"><IMG name="img2"
border="0" src="men1001.jpg" width="231"
height="48"></A></TD> </TR>
<TR> <TD><A href="http://www.yoururl.com"
onmouseover="imgOn('img3')" onmouseout="imgOff('img3')"><IMG name="img3"
border="0" src="men1002.jpg" width="231"
height="74"></A></TD> </TR>
</table> |
