slideUp 및 slideDown을 숨겨진 div에 추가

Question

FAQ 페이지의 숨겨진 div에서 페이드 인 및 페이드 아웃 효과를 만들기 위해 아래를 사용하고 있습니다. 문제는 숨겨진 div 스냅을 열어 닫아서 매우 짜증나게하는 것입니다. 나는 자바 스크립트에서 너무 뜨겁지 않고 slideUp과 slideDown을 얻는 방법을 알아낼 수 없다. 나는 슬라이드와 슬라이드를하고 싶다. 이 스크립트에 슬라이딩 기능을 추가 할 수있는 방법이 있습니까? 감사.

$(document).ready(function() {         
    $("a[name^='faq-']").each(function() { 
     $(this).click(function() { 
      if($("#" + this.name).is(':hidden')) { 
       $("#" + this.name).fadeIn('slow'); 
      } else { 
       $("#" + this.name).fadeOut('slow'); 
      }   
      return false; 
     }); 
    }); 
}); 

Answer 1

대신 display:none의 된 div를 숨길 visibility: hidden를 사용하여 작은 CSS의 비틀기와 함께이 문제를 해결할 수 있습니다. 이것은 페이딩되고있는 DIV를위한 공간을 &에 예약합니다.

& 페이드를 동시에 슬라이드시키고 싶습니까? .animate()을 사용하여 불투명도를 0/1로 설정하고 높이를 최대/0으로 사용하십시오.

Answer 2

slideUp/slideDown 대신 페이딩을 사용하려는 경우 fadeTo(duration, opacity)을 사용하면 요소의 공간이 유지되므로 물건을 건너 뛰지 않아도됩니다.

당신이 슬라이드와 페이드를 결합 할 수있는 플러그인을 원하는 경우에, 어쩌면이 체크 아웃 : http://css-tricks.com/snippets/jquery/combine-slide-and-fade-functions/