하나 이상의 요소에서 jQuery slideToggle이 작동하지 못하도록 제한했습니다.

Question

나는 이미지가 반복되는 블록을 가지고 있으며, 아래에 각각 캡션이 있습니다. slideToggle을 사용하여 이미지를 클릭 할 때 각 이미지의 캡션을 표시하거나 숨 깁니다.

$('.imageholder').click(function() { 
$(this).next().slideToggle("fast"); 

}); 

내 방법을 보여주는 작업 fiddle은 here입니다.

이것은 제대로 작동하지만 여러 캡션이 동시에 보이지 않도록하고 싶습니다. 사용자가 이미지를 클릭하면 열려있는 캡션을 닫아야합니다. 필자의 예에서는 모든 캡션을 열 수 있음을 알 수 있습니다. 이것이 내가 막고 싶은 것입니다.

올바른 방향으로 조금 움직여 주시면 감사하겠습니다. 감사.

Answer 1

그냥 다음과 같이하십시오.

$('.imageholder').click(function() { 
    $('.description').slideUp(); 
    $(this).next().slideToggle("fast"); 
}); 

Answer 2

당신은 다른 볼 요소를 숨기기 시도해야한다 : 현재 하나없는

$('.imageholder').click(function() { 
    $('.description:visible').not($(this).next()).slideToggle("fast"); 
    $(this).next().slideToggle("fast"); 
}); 

Answer 3

slideUp() 모든 안내, 다음 slideToggle() 현재 하나.

$('.imageholder').click(function() { 
    var $desc = $(this).next(); 
    $('.description').not($desc).slideUp('fast'); 
    $(this).next().slideToggle("fast"); 
});