Jquery 와 Tabs 플러그인을 사용하면
간단하고 확장성 높은 탭을 구현할수 있습니다.
<link rel="stylesheet" href="http://chancein.com/Demo/Jquery/Tabs/ui.tabs.css" type="text/css" media="print, projection, screen">
<script src="http://chancein.com/Demo/Jquery/Tabs/jquery-1.2.3.pack.js" type="text/javascript"></script>
<script src="http://chancein.com/Demo/Jquery/Tabs/ui.tabs.pack.js" type="text/javascript"></script>
<script>
$(function() {$('#container-1 > ul').tabs();});
</script>
<div id="container-1">
<ul>
<li><a href="#fragment-1"><span>첫번째</span></a></li>
<li><a href="#fragment-2"><span>두번째</span></a></li>
<li><a href="#fragment-3"><span>세번째</span></a></li>
</ul>
<div id="fragment-1">
내용1
</div>
<div id="fragment-2">
내용2
</div>
<div id="fragment-3">
내용3
</div>
</div>
예제 링크 : http://chancein.com/Demo/Jquery/Tabs/1.html
더많은 예제의 확인은 위의 전체 예제링크에서 확인하세요.
Posted by 바람부는데로




