JAVASCRIPT#51 - jQuery UI tab 만들기

Hey yeah i wanna a shoop baby ♡

JAVASCRIPT#51 - jQuery UI tab 만들기

- 이제 실전 예제할 차례인데 포스팅하기 애매하니 특정스킬 위주로 포스팅함.

1. 제이쿼리 탭만들기 1단계 : HTML 헤드에 외부파일 로드하기

<link rel="stylesheet" href="Imported/jquery-ui.css">
<script src="Imported/jquery.js"></script>

<script src="Imported/jquery-ui.js"></script>

2. 제이쿼리 탭만들기 2단계 : 탭 DIV 만들기

 

<div id="MYTAB">

<ul>
     <li><a href="#tab-1">Info</a></li>
      <li><a href="#tab-2">Review</a></li>
      <li><a href="#tab-3">QnA</a></li>
</ul>

<div id="tab-1">
    INFO!
</div>

<div id="tab-2">
    Review!
</div>

<div id="tab-3">
    QnA!
</div>

</div>

href 를 통해서 각탭내용을 할당하고있음!

3. jQuery UI 초기화를 위해 JS 작성.

$("#MYTAB").tabs();