Il codice che ti ho postato funziona su firefox 9.0, chrome 16 e ie7 - 8 - 9.
Altri browser e versioni non ho provato.
Per la versione js, una possibile è questa:
codice:
<head>
<style type="text/css">
dd { display: none; }
</style>
<script type="text/javascript">
function show(id) {
document.getElementById(id).style.display = "block";
}
function hide(id) {
document.getElementById(id).style.display = "none";
}
</script>
</head>
<body>
<dl>
<dt onmouseover="show('prezzo_1')" onmouseout="hide('prezzo_1')">Prodotto 1</dt>
<dd id="prezzo_1">Prezzo 1</dd>
<dt onmouseover="show('prezzo_2')" onmouseout="hide('prezzo_2')">Prodotto 2</dt>
<dd id="prezzo_2">Prezzo 2</dd>
<dt onmouseover="show('prezzo_3')" onmouseout="hide('prezzo_3')">Prodotto 3</dt>
<dd id="prezzo_3">Prezzo 3</dd>
</dl>
</body>
In questo caso userei una lista di definizione, logicamente mi sembra la più appropriata.