Gunsmoke- I'm not using any jpg's. Not sure why it is loading as a jpg. To be honest, I wouldn't have the first idea how to alter the code.

Paintbrush- I think that's going to have to be the solution for now. Thank you. And actually, I think it will be "cleaner" using text links. I will try to figure the rest out when I have to use transparent image buttons. For some reason, the GIF is not working either.

Gunsmoke, the problem is that layering transparent PNGs in mouseovers causes the black bounding-box to show on hover, rather than keeping the transparency.

Googling turned up some solutions, but they involve HTML5 (beyond VSD at this time) and Javascript.

Yea, kinda just found the same thing with CSS3 and using 'opacity' values. Semi-Transparent is the best anyone could offer. Thanks.

Paintbrush- any idea how to change the colour of the link on the mouseover? I can't seem to add the mouseover feature to a text link.

KB, Forget the mouseover, you don't need it.
Go to Settings > Standard Settings for New Pages. Choose your link colors and whether you want underlines or not.
Now type your links (one text box for each link so you can space them how you want). Create your links (the text will be always be underlined within VSD so you can see what you have linked). Go to Preview and hover over your menu item, you should see it change to your chosen color.

Hi Paintbrush, thank you. I was being a bit simple. Forgot that you can choose a hover colour in the settings menu.

Not sure if anyone is still following this thread.
Gunsmoke, you were right, VSD is inserting a JPG for the mouseover, where I have attached a PNG image.
I did figure out how to use the PNG mouseover with html, thanks to Eric's site http://progrower.coffeecup.com/mouseovergif.html I just substituted the GIF for PNG.
Unfortunately, when I try to add more than one button, the mouseover stops working. Any idea why?

This is the link where the mouseover works correctly
http://thruwayspring.coffeecup.com/Light_service.html

code:

<a href="Light_service.html"
onMouseover="myimage.src='images/button_mo.png'"
onMouseout="myimage.src='images/button.png'">
<img src="images/button.png"
width=200
height=125
border=0
name="myimage">
</a>


Here, I've added a second button and the mouseover stops working
http://thruwayspring.coffeecup.com/Heavy_service.html

code

<a href="Light_service.html"
onMouseover="myimage.src='images/button_mo.png'"
onMouseout="myimage.src='images/button.png'">
<img src="images/button.png"
width=200
height=125
border=0
name="myimage">
</a>

<a href="Light_service.html"
onMouseover="myimage.src='images/button_mo.png'"
onMouseout="myimage.src='images/button.png'">
<img src="images/button.png"
width=200
height=125
border=0
name="myimage">
</a>

Did you find the problem? Your buttons appear to work for me

I notice on your code that you simply pasted the same button twice under Light_service. Was that correct? I don't really get into code, but I think you would need separate button names for the different menu options.