Desaparecer entre as fotos e a descrição do texto cor desvanece-se - jquery, html, css3

Eu escrevi esta parte do código para desaparecer entre doiscenário. Há também uma pequena descrição abaixo e quero que o texto mude a cor e a imagem desapareça para a segunda quando o mouse estiver "pairando" a caixa.

Infelizmente, estou tendo problemas com a alteração da cor do texto e a imagem desbotada. Se o mouse estiver na caixa, o texto muda de cor, mas a foto não desbota para a segunda.

Isto é o que eu uso para a imagem desaparecer:

$("img.grey").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "1"}, "slow");
});

Alguma dica?

Aqui está o violino: http://jsfiddle.net/IronFeast/BGKFN/26/

Respostas:

Faça a alteração da imagem ao passar o mouse sobre o link, não a imagem:

$(".box a").hover(
function() {
$(this).find("img.grey").stop().animate({"opacity": "0"}, "slow");
},
function() {
$(this).find("img.grey").stop().animate({"opacity": "1"}, "slow");
});

http://jsfiddle.net/BGKFN/28/

Editar
Ou simplesmente como: http://jsfiddle.net/BGKFN/30/

$(".box a").hover(function( e ) {
$(this).find("img.grey").stop().animate({opacity: e.type=="mouseenter"?0:1}, 800);
});

onde jQuery "s hover é uma forma abreviada de mouseenter mouseleave,
o que significa que se segmentarmos o atual e evento, estamos recebendo um dos dois e usando um ternary operator ( ? : ) estamos definindo a opacidade para 0 se true (é o mouseenter) e para 1 se falso (se for rato).