Buongiorno a tutti.
Ho un problema con un semplice menu costruito con immagini di dim. non > di 900bytes ed eventi onmouseover ed onmouseout.
In realtà da un punto di vista grafico non noterei grande differenza se lo facessi interamente in javascript senza caricare alcuna immagine.In questo secondo caso la mia pagina è:

<html>
<head>
<style>
.Item {
cursor: hand;
font-family: verdana;
font-size: 10pt;
font-style: normal;
background-color: white;
text-decoration:none;
border-color:white;
color: black}

.Highlight {
cursor: hand;
font-family: verdana;
font-size: 10pt;
font-style: normal;
background-color: white;
color: orange;
text-decoration:none;
border-color:red;
border-width:20px }
</style>

<script>
function rollon() {
window.event.srcElement.className = "Highlight";
}

function rolloff() {
window.event.srcElement.className = "Item";
}
</script>


</HEAD>



<BODY >

<table summary="" cellpadding="0" cellspacing="0" border="0" onmouseover="rollon()" onmouseout="rolloff()">
<tr >
<td><div id="item">Presentazione</div></td>
</tr>
<tr >
<td>incontri</td>
</tr>
<tr>
<td >news</td>
</tr></div>
</table>


</body>
</html>

Prima di tutto vorrei che ,passando col mouse su "presentazione" ad esempio, non si illumini solo il testo, ma anche i bordi della cella della tabella che contiene PRESENTAZIONE.
Inoltre vorrei che cliccando su incontri mi si apra un sottomenu.

Come posso fare?
Grazie