Search Results for:

앞에서 설명했던 jQuery 코드를 응용하여 항목을 누르면 다른 항목은 모두 숨겨지도록 수정한 버전입니다. 시각적인 효과상으로 보기 좋도록 slideUp()을 이용했습니다. $(document).ready(function() { jQuery(".content").hide(); //content 클래스를 가진 div를 표시/숨김(토글) $(".heading").click(function() { $(".content").not($(this).next(".content").slideToggle(500)).slideUp(); }); }); 데모 (* 참고: 워드프레스에서 위 코드를 사용할 경우 $를 일괄적으로 jQuery로 변경하시기 바랍니다.) 추가: 위와는 조금 다르게 와 요소에 일련번호(예: menu1, menu2, menu3...)가...

Q&A나 FAQ(자주 묻는 지문) 처럼 제목을 누르면 내용이 펼쳐지고 다시 누르면 내용이 접히는 jQuery입니다. 단순하지만 유용하게 사용할 수 있는 코드입니다. 워드프레스를 사용하는 경우 아바다 테마나 엔폴드 테마 등에서 제공하는 아코디언/토글 기능을 사용할 수 있습니다. 엘리멘터 페이지 빌더에서도 토글과 아코디언 위젯을 제공합니다. 아바다 테마에서 FAQ/토글 엘리먼트가 표시되지 않는 경우 여기를 참고해보세요. 자바스크립트를 사용한 아코디언/토글 기능 이...