Need some css help

I'm looking to simplify my site so it's not so long. If you look at:

http://www.canemasters.com/class-cane-p-297.html

what I'm wanting to do is to have only one image, and a css menu above the image with the different wood types. eg: hickory, hickory w/ heartwood,.... etc.

When you click the name of the wood type, the image will change. I'm playing with some css menus, but when you click the menu link, it's set up to take you to a url, not change an image.

I found this css menu generator at: http://cssmenumaker.com/process/step1.php?menu=h9

You can see what I'm trying to do there.

The generated html code I get is this:

<ul id='menu'> <li ><a class='current' href='http://www.canemasters.com' >Hickory</a></li> <li ><a href='http://www.canemasters.com' >Hickory w/ Heartwood</a></li> <li ><a href='http://www.canemasters.com' >Pure Hickory Heartwood</a></li> <li ><a href='http://www.canemasters.com' >Oak</a></li> <li ><a href='http://www.canemasters.com' >Cherry</a></li> </ul> -------------------------------------------------------------------------------------- And the css is this: -------------------------------------------------------------------------------------- ul#menu { width: 100%; height: 43px; background: #FFF url("images/menu-bg.gif") top left repeat-x; font-size: 0.8em; font-family: "Lucida Grande", Verdana, sans-serif; font-weight: bold; list-style-type: none; margin: 0; padding: 0; } ul#menu li { display: block; float: left; margin: 0 0 0 5px; } ul#menu li a { height: 43px; color: #777; text-decoration: none; display: block; float: left; line-height: 200%; padding: 8px 15px 0; } ul#menu li a:hover { color: #333; } ul#menu li a.current{ color: #FFF; background: #FFF url("images/current-bg.gif") top left repeat-x; padding: 5px 15px 0; } --------------------------------------------------------------------------------------

How would I make it pull up an image directly below the css menu?

Thank you!

You might look at this module and adapt to a simple menu/hover or on-click swap to some other image

http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=311

kobra:

You might look at this module and adapt to a simple menu/hover or on-click swap to some other image

http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=311
There is a fix for this mod at
http://www.zen-cart.com/forum/showthread.php?p=556581#post556581
which has been resubmitted to downloads section, and is awaiting entry.

I tried to install this, but it is conflicting with hover box 3 rc2, which I'd like to keep. I'd really like to get this css menu image swap working. How do I make it swap a single image rather than jump to a new page when I click the wood name in the menu?

Okay, I got the css menu up, but it's linking to pages. I see how it's doing that in the html code... how do I make it change the image below...?

Oh yes, the page that I "almost" have working is:

http://www.canemasters.com/dojo-cane-p-295.html

I'd really like to get this css menu image swap working
Looks like you have the css menu added BUT I and misty were referring to the swap on mouseover Module and adapting it to your use

On mouse over can also be changed to on-click fairly easy

Awesome. I'll give it a shot.

Every time I install that mod, it overwrites some of the files used by the hoverbox3 mod and disables it. I'd like to keep that mod. Isn't there any other way to make this work?

Also, is there a site you can point out to me where I can see this mod that you are talking about in action?

I found a site using that mod. It's not moving the picture that I want moved though. It's moving the thumbnail, and I want it to move the large image below it.

Every time I install that mod, it overwrites some of the files used by the hoverbox3 mod and disables it. I'd like to keep that mod. Isn't there any other way to make this work?
Merge the 2 mod files as they most likely adjust different things within the file and you can create one file that has both
It's not moving the picture that I want moved though.
Get it working and you can then resize the additional images from the admin