Mostrar Imagem ao passar mouse

Olá pessoal, queria saber uma forma para quando o usuário colocar o mouse em cima de um link, que seja mostrado uma imagem X.

Por exemplo:

Fiz uma busca em meu banco de dados, na tabela produtos, então todos os produtos são mostrados na tela como um link.

por exemplo: Motorola V3, queria que quando o usuário colocasse o mouse no link, aparecesse a imagem do motorola V3, quando tirasse o mouse a imagem desaparecesse.

Obs.: O caminho da imagem tb está gravada na tabela produtos. Então quando eu retorno os dados da tabela eu faço um loop e mostro todos produtos da consulta com as variaveis $codigo, $descricao e $imagem.

obrigado.

veja isso...


<script>
function aparece(){
document.getElementById("teste").style.visibility = 'visible';
}

function desaparece(){
document.getElementById("teste").style.visibility = 'hidden';
}
</script>
<a href="#" onmouseover="aparece()" onmouseout="desaparece()">Teste</a>
<div id='teste' style="visibility='hidden'">Teste</div>

Valeu...

era isso mesmo que precisava..

<. .>
.

Olá, tentei fazer, mas nao deu certo.

Quando coloco o nome da div dentro da funcao dá certo, mas meu caso preciso passar o nome da div por parametros, pois são varias div.

fiz assim mas nao deu certo:

function aparece(id){
document.getElementById('id').style.visibility='visible';
}
function desaparece(id){
document.getElementById('id').style.visibility='hidden';
}

<a href='detalhesproduto.php?cod=$cod&marca=$marca' onmouseover='aparece('div$cod')' onmouseout='desaparece('div$cod')'>$descricao&nbsp</a>

Obrigado...

tira as aspas
function aparece(id){
document.getElementById(id).style.visibility='visible';
}
function desaparece(id){
document.getElementById(id).style.visibility='hidden';
}

ja tirei mas nao deu certo...

tem mais alguma dica?

de um alert(id); no começo da função e veja o que está trazendo.

// Testa isso

<script>
function mostraOculta(id){
obj = document.getElementById(id);
obj.style.display=(obj.style.display=='none'?'':'none');
}


<a href="#" onMOuseOver="mostraOculta('div1');" onMOuseOut="mostraOculta('div1');>DIV 1</a> <br />
<a href="#" onMOuseOver="mostraOculta('div2');" onMOuseOut="mostraOculta('div2');>DIV 2</a> <br />
<a href="#" onMOuseOver="mostraOculta('div3');" onMOuseOut="mostraOculta('div3');>DIV 3</a> <br />
<a href="#" onMOuseOver="mostraOculta('div4');" onMOuseOut="mostraOculta('div4');>DIV 4</a> <br />