View Full Version : Help with Images that change with list mouseover

01-12-2004, 12:37 AM
I know some basic html and a little php. So I am basically web programming challenged. I am learning but I need some help. What I want to do is as follows:

1) Create a static list in a table cell.
2) When the mouse pointer is moved over the cell I want to have the next cell contain an image that changes and is unique for each item in the list. I have about 5 items currently in the list.

Does anyone have script that does this that I could obtain and modify, or provide me with guidance on how to do the above? Any help would be much appreciated.


1/12/04 - Works like a charm. Many thanks. thumbsup:

01-12-2004, 02:28 AM
Try this:

<table border="0" cellspacing="0" bordercolor="#111111" width="100%" cellpadding="0">
<td width="21%" onMouseOver="image1.src='image1.gif'" onMouseOut="image1.src='default_image.gif'">Item A</td>
<td width="79%" rowspan="5">
<p align="center"><img name="image1" src="default_image.gif"></td>
<td width="21%" onMouseOver="image1.src='image2.gif'" onMouseOut="image1.src='default_image.gif'">Item B</td>
<td width="21%" onMouseOver="image1.src='image3.gif'" onMouseOut="image1.src='default_image.gif'">Item C</td>
<td width="21%" onMouseOver="image1.src='image4.gif'" onMouseOut="image1.src='default_image.gif'">Item D</td>
<td width="21%" onMouseOver="image1.src='image5.gif'" onMouseOut="image1.src='default_image.gif'">Item E</td>

If you dont want any image in the cell initially, just make the "default_image.gif" fully transparent OR the same colour as the background.

Hope this helps.


01-12-2004, 07:00 AM
you must use absolute reference to the image to make it cross-browser.


EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum