jQuery accordian - нажмите, чтобы развернуть, нажмите, чтобы закрыть

Question

У меня проблемы с некоторыми сценариями, которые я написал. HTML и jQuery показаны ниже. В настоящее время, если вы нажмете заголовок .each-question, это ответные слайды. Если вы нажмете другой заголовок .each-question, открытый ответ будет отменен, а новый ответ будет уменьшен. Тем не менее, если вы нажмете заголовок .each-question того же самого ответа, который уже открыт, он не сможет выполнить скольжение и, скорее, сместится и вернется вниз.

Я хочу, чтобы это было так, если вы нажмете заголовок ответа, который уже открыт, он скользит вверх и остается вверх.

$('.faq > .each-question').click(function() { 
    $('.faq > .each-answer').slideUp('normal'); 
    $(this).next().slideDown('normal'); 
}); 
$('.faq > .each-answer').hide(); 

<div class="each-question"> Where do your ideas come from? </div> 
<div class="each-answer"> Text for answer </div> 

ОБНОВЛЕНИЕ - jsFiddle http://jsfiddle.net/YZBLg/

Приветствия заранее, R

Answer 1

Попробуйте jsfiddle:

$('.faq > .each-question').click(function() { 
    $('.faq > .each-answer').slideUp('slow'); 
    if($(this).next('.each-answer').is(':not(:visible)')){ 
     $(this).next('.each-answer').slideToggle('normal'); 
    } 
}); 
$('.faq > .each-answer').hide(); 

Answer 2

Попробуйте использовать .slideToggle()

$('.faq > .each-answer').slideToggle('normal'); 
$(this).next().slideToggle('normal');