아코디언과 jQuery

Question

아코디언을 jQuery와 함께 구현하려고하지만 문제가 있습니다. 단추를 누를 때 slideToggle 정보로되어 있지만 대신 단지 미끄러지 듯 움직입니다.

나는 왜 이런 식으로 행동하는지 모르겠다. 나는 배우고 있으며, 누군가가 나를 도와 줄 수 있다면 감사 할 것이다.

$(".wrap-faq a").on("click",accordion); 

function accordion() { 
    if($(this).attr("class") != "active"){ 
     $(".wrap-faq li p").slideDown(); 
     $(this).next().slideToggle(); 
     $(".wrap-faq a").removeClass("active"); 
     $(this).addClass("active"); 
     } 
} 

나는 또한 내 JSFiddle 데모에 대한 링크를 떠나 : http://jsfiddle.net/zZaTf/

Answer 1

당신은 숨겨진 요소에서 작동하지 않습니다 .txt-ans-faq 클래스와 slide... 효과에 display: none을

이 내 자바 스크립트입니다. 글쎄, 그렇 겠지, 네가 보지 않을거야.

Answer 2

Ilia 메모에 따르면 display: none은 콘텐츠 텍스트를 볼 수 없으므로 처음부터 삭제합니다. 초기 slideUp()을 호출하여 모든 콘텐츠를 숨길 수 있습니다.

실제 slideToggle

단순히이 방식으로 구현 될 수있다

$(document).ready(function() { 

    $('.txt-ans-faq').slideUp(0); 

    $('.wrap-faq a').click(function(e) { 
     $(this).next().find('.txt-ans-faq').slideToggle(300); 
    }); 
}); 

Fiddle

Answer 3

나는 사이먼 아코디언 스크립트를 업데이트했습니다.

$(document).ready(function() { 

    $('.txt-ans-faq').slideUp(0); 

    $('.wrap-faq a').click(function(e) { 
     $('.txt-ans-faq').slideUp(300);  
     $(this).next().find('.txt-ans-faq').slideToggle(300); 
    }); 
}); 

http://jsfiddle.net/zZaTf/9/