jindo.m.Accordion

Accordion

제목탭과 내용탭이 쌍으로 펼쳐지고 접혀지는 컴포넌트

기능

• 열기 : collapse
• 펴기 : expand
• 전체 열기 : collapseAll
• 열려 있는 인덱스 가져오기 : getExpandIndex
• Effect 설정 : getExpandIndex

이벤트

• 열리기 전 : beforeExpand
• 열린 후 : expand
• 닫기 전 : beforeCollapse
• 닫은 후 : collapse

비교 컴포넌트

github에서 star가 100이상되는 컴포넌트를 확인해본 결과 Easy-Responsive-Tabs-to-Accordion , Responsive-Tabs, acc-wizard, navgoco , v-accordion, Accordion 을 찾았다.

이 중에 Accordion이 기존의 모든 기능과 이벤트을 포함하고 있어, 기존 JMC컴포넌트를 대체하는데 적당하다.

예제

JMC 링크

var oAccordion = new jindo.m.Accordion(jindo.$("panel"));
oAccordion.attach("expand", function(){
 console.log("open");
});
oAccordion.attach("collapse", function(){
 console.log("close");
});

jQuery Accordion 링크

$( ".selector" ).accordion();
$( ".selector" ).on( "accordionactivate", function( event, ui ) {
  event.newHeader; // open
  event.oldHeader; // close
} );