웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall] Making Accordions with the Tabs(jquery) 본문

웹프로그램밍 자료실/JAVA 자료

[해피CGI][cgimall] Making Accordions with the Tabs(jquery)

해피CGI윤실장 2019. 4. 2. 09:13

탭메뉴를 이용해서 Accordions 을 만드는 jquery 플러그인 스크립트입니다.

첨부된 파일을 다운로드 받아서,
압축을 해제하면 나오는
index.htm 파일을 웹브라우저로 열어서 보면 데모를 확인하는게 가능합니다.

 

 

브라우저로 열어보면
화면에 위 그림과 같이 표시가 되는데,

첫번째, 두번째, 세번째 탭을 클릭해보면
Accordions 으로 작동이 됩니다.


소스코드를 문서편집기로 열어서 보면,
HTML태그 의 구조는

 

 

위와 같이 비교적 간단한 구조입니다.


id 가 accordion 에 속해있는 div 태그를 accordion 으로 전환해주는 자바스크립트는 아래와 같습니다.

 

 

탭으로 사용할 태그와, 효과, 기본적으로 펼쳐져 있어야 할 탭 등을 지정할수 있는걸로 예상이 되네요.

 

 

 

홈페이지바로가기 소스다운로드

Comments