Rollovers..., Rollovers with a div overlay to show image behind Options

[golrg]

Basically i've made a background with a DIV over the top of it.

The images in the div are the same as beneath them only darker.. I want to roll over the images and have it show the image below.

I dont know if what I've got is right, or if I need something else to go along with it... Never tried Myspace rollovers before

Please help :)


Heres my codes:

CODE

<style>
.nav1 { top: 599px; width: 900px; margin-left: -450px; _margin-left: -450px; left: 50%; text-align: left; position: absolute; z-index: 2; }

.nav1 a:hover { border-top: none; opacity: 0.0; filter: alpha(opacity=0); z-index:9;}</style>
</style>

CODE

<div class="nav1"><table id="Table_01" width="900" height="50" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="http://www.littlekingdesign.co.uk/tpmyspace/images/buttons_01.jpg" width="60" height="50" alt=""></td>
<td>
<a href="http://messaging.myspace.com/index.cfm?fuseaction=mail.messageV3&friendID=323557430&MyToken=a1524fc5-9bba-4adc-a1f7-001167e09d66"><img src="http://www.littlekingdesign.co.uk/tpmyspace/images/buttons_02.jpg" width="162" height="50" alt=""></a></td>
<td>
<img src="http://www.littlekingdesign.co.uk/tpmyspace/images/buttons_03.jpg" width="120" height="50" alt=""></td>
<td>
<img src="http://www.littlekingdesign.co.uk/tpmyspace/images/buttons_04.jpg" width="193" height="50" alt=""></td>
<td>
<img src="http://www.littlekingdesign.co.uk/tpmyspace/images/buttons_05.jpg" width="133" height="50" alt=""></td>
<td>
<img src="http://www.littlekingdesign.co.uk/tpmyspace/images/buttons_06.jpg" width="232" height="50" alt=""></td>
</tr>
</table></a></div>

Reason for edit: Please use [codebox] tags instead of [code] tags when posting longer codes. - Mike