• 탭 1
• 탭 2

<ul class="tab-1 col2" data-type="tab">
	<li class="active"><a href="#tab-1">탭 1</a></li>
	<li><a href="#tab-2" >탭 2</a></li>
</ul>
<div id="tab-1" class="tabCont"><!-- tab-1 내용 --></div>
<div id="tab-2" class="tabCont"><!-- tab-2 내용 --></div>

아코디언

• 아코디언 타입 샘플

  <ul class="accordion" data-type="accordion" data-active="0" data-view="multi">
  	<li>
  		<a href="#" class="aTitle ico2 i-arrow">아코디언 타입 <strong class="highlight">샘플</strong></a>
  		<div class="aCont"><!-- 내용 --></div>
  	</li>
  </ul>
  

  사용 예

  $('ul[data-type="accordion"]).accordion();

  Option

  data-titles : 클릭 이벤트를 발생시키는 버튼 요소.
  예) ">li>a", ".aTitle"

  data-cont : 클릭 이벤트를 발생시 보여지는 요소.
  예) ">li>div", ".aCont"

  data-active : 페이지 로딩시 활성화 시킬 요소 번호. 0부터 시작.

  data-view : 아코디언 방식지정 생략시 normal.
  예) "multi", "single"
  - normal : 클릭시 토글형태이며, 한개가 펼쳐지거나 전부 닫힌 형태
  - multi : 클릭한 영역에 대해서만 토글형태이며, 한개 또는 여러개가 펼쳐지거나 전부 닫힌 형태
  - single : 토글이 아니며, 클릭한 영역만 펼쳐지고 다른 목록은 닫힘. 항상 한개가 펼쳐진 형태

• 할 수 있다는 자신감으로 도전적인 목표를 설정하고 달성하는 사람
  • 자기 개발의 단기/중장기 목표를 체계적으로 설정하고 목표 달성을 위해 적극적으로 기회/방안을 찾아 실천합니다.
  • 자신의 희망 직무, 희망 계열사 관련 트렌드 변화를 수시로 파악합니다.
  • 희망하는 직무와 관련된 전문성을 갖추기 위한 기초지식 및 경험을 쌓으며 희망 직무와 관련된 멘토의 지혜를 구합니다.

내부링크 이동 모션

<a href="#container" data-rel="anchorani">#container으로 이동</a> <!-- A tag 지향 -->
<button data-url="#container" data-rel="anchorani">#container으로 이동</button> <!-- href속성 지원 안 할 경우 data-url -->

사용 예

data-rel="anchorani"이 있으면 실행 됨.

Option

스크롤 위치 컨텐츠 Element는 href속성이나 data-url의 속성값으로 찾는다.
예) <a href="#id">, <button data-url="#id">