Jquery cliquez et toggleClass question

Question

voici mon problème probablement (et j'espère) simple:

J'ai une liste avec des images comme navigation. Quand vous survolez, jquery anime un div avec une légende et le montre. il disparaît à la sortie de la souris. (fonctionne bien)

Lorsque vous cliquez sur l'image, la légende div s'anime davantage et recouvre complètement l'image (fonctionne bien). en survolant une autre image dans la navigation, la légende div s'anime (fonctionne bien). Le problème: en cliquant sur une seconde image de navigation, l'animation du premier (cliqué) devrait disparaître.

est ici le jquery:

var thumbslide = $('.boxgrid.captionfull').click(function() { 
    $(this).toggleClass('clicked').children('.cover').stop().animate({top: 0, height:"230px", opacity: 1}, 350); 
}); 
$('.boxgrid.captionfull:not(.clicked)').live('mouseenter', function() { 
    $(this).children('.cover').stop().animate({top: 130}, 350); 
}).live('mouseleave', function() { 
    $(this).children('.cover').stop().animate({top: 230}, 350); 
}) 

et est ici un lien vers le dev site

toute aide est la bienvenue, merci.

Answer 1

Cela supprime la classe clicked et anime vers le bas et retourne l'opacité de retour à 0,7:

var thumbslide = $('.boxgrid.captionfull').click(function() { 
    $('.boxgrid.captionfull.clicked').removeClass('clicked').children('.cover').stop().animate({top: 230, opacity: 0.7}, 350); 
    $(this).toggleClass('clicked').children('.cover').stop().animate({top: 0, height:"230px", opacity: 1}, 350); 
}); 

Answer 2

N'est-ce pas juste un cas de trouver un autre élément cliqué et de supprimer sa classe cliquée?

var thumbslide = $('.boxgrid.captionfull').click(function() { 
    $('.boxgrid.captionfull.clicked').removeClass('clicked'); 
    $(this).toggleClass('clicked').children('.cover').stop().animate({top: 0, height:"230px", opacity: 1}, 350); 
});