Java Script / Image Mouseover

I've had quite an interest in the script layout of my "Universal Angels"

I decided to put the script on a page, for those interested, to copy and paste.

You will need only to do a couple of things before using this script.
First, you should make "Thumbnails" of your original images.

You can make Thumbnails at "Image Magick".

Just choose the "Resize" button.

If you have a PC..You may have a program, that will whip out those Thumbnails for ya! ..;-)

All my Thumbnails are 50x50.
In this script, all images in the "Left" column are listed a thru f

Images in the "Right" column are listed g thru l
I have typed in "CAPITAL" letters, where to insert your URL's.

All URL's of your images are the original image.

Unless, it says "THUMBNAIL".
Experiment using your own Backgrounds or Bgcolor.

Also, use whatever colors you like for your Text and Fonts.
Below, is the Java Script, for you to Copy and Paste.

Have fun!

If you like, send me your final page.

I'd love to see what you come up with!

MisRox

<html><head><base target=main><title>YOUR TITLE</title></head><body background="http://BACKGROUND URL / OR BGCOLOR"text="#?"alink="#?"link="#?"vlink="#?"><center><script language=JavaScript>// -->
</script><div align=center><center><table bgcolor="#?" border="3"cellpadding="3"cellspacing="0" width="100%"><tr><td background="YOUR BACKGROUND URL / OR BGCOLOR"align="center"valign="middle"><a href="FIRST IMAGE URL" onmouseover="imgon('a');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF FIRST IMAGE URL"></a><br><a href="SECOND IMAGE URL" onmouseover="imgon('b');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF SECOND IMAGE URL"></a><br><a href="THIRD IMAGE URL" onmouseover="imgon('c');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF THIRD IMAGE URL"></a><br><a href="FOURTH IMAGE URL" onmouseover="imgon('d');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF FOURTH IMAGE URL"></a><br><a href="FIFTH IMAGE URL" onmouseover="imgon('e');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF FIFTH IMAGE URL"></a><br><a href="SIXTH IMAGE URL" onmouseover="imgon('f');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF SIXTH IMAGE URL"></a></td><td background="YOUR BACKGROUND / OR BGCOLOR"align="center"valign="top"><font size="5"color="#?"><b>
YOUR PAGE TITLE HERE
</b><br></font><font size="1"color"#?">
Click on a thumbnail  to view a larger image.
</font><br><br><img src="images/default.jpg" border="0" name="delta"WIDTH="227" height="275"></td><td background="YOUR BACKGROUND / OR BGCOLOR HERE"align="center"valign="middle"><a href="FIRST IMAGE URL (STARTING OF THE RIGHT COLUMN)" onmouseover="imgon('g');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF FIRST IMAGE URL"></a><br><a href="SECOND IMAGE URL" onmouseover="imgon('h');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF SECOND IMAGE URL"></a><br><a href="THIRD IMAGE URL" onmouseover="imgon('i');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF THIRD IMAGE URL"></a><br><a href="FOURTH IMAGE URL" onmouseover="imgon('j');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF FOURTH IMAGE URL"></a><br><a href="FIFTH IMAGE URL" onmouseover="imgon('k');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF FIFTH IMAGE URL"></a><br><a href="SIXTH IMAGE URL" onmouseover="imgon('l');
 return true;" onmouseout="imgoff();
 return true;"><img src="THUMBNAIL OF SIXTH IMAGE URL"></a></td></tr></table></center></body></html>

HOME