Problema animazione con animate e hover

[davide1982]

Salve, sono alle prese con l'animazione di un menu e vorrei che quando si passa con il mouse su una categoria (che è rappresentata da un'immagine) questa si sposti in alto e quando si va via col mouse ritorni dov'era prima.

<div id="categorie">
        <span>
        	<img src="uno.png" />
        	<em style="display: none;"></em>
        </span>
        <span>
        	<img src="img/due.png" />
        	<em style="display: none;"></em>
        </span>
        <span>
        	<img src="img/tre.png" />
        	<em style="display: none;"></em>
        </span>
</div>

// ANIMAZIONE MENU CATEGORIE
			function passa(){
				$(this).next("em").animate({marginTop:"15px"},"fast");
			}

			function allontana(){
				$(this).next("em").animate({marginTop:"0px"},"normal");
			}

			$("#categorie img").hover(passa,allontana);
		});

Ho provato in diversi modi, quello sopra è il mio ultimo tentativo invano... in ogni caso mi sposta sempre TUTTO il blocco di immagini insieme quando ci passo su col mouse...

HELP! come si fa?

 

[alessandro1997]

Invece di usare $(this).next("em") prova ad usare $(this).parent().next("em"), ma non sono sicuro che funzioni.

 

[davide1982]

Purtroppo no, non funziona

 

[Evit]

Salve, sono alle prese con l'animazione di un menu e vorrei che quando si passa con il mouse su una categoria (che è rappresentata da un'immagine) questa si sposti in alto e quando si va via col mouse ritorni dov'era prima.

Perchè non utilizzare i CSS? Io la vedo più semplice.

 

[davide1982]

senza ricorrere a javascript intendi? 0