Jqueryを使ったタブ
Jqueryをつかったタブは下記の様にする
参考:http://5am.jp/jquery/jquery_ui_tabs/
<head>
<!-- jQuery -->
<script type="text/javascript" src="/jquery-1.####.min.js"></script>
<!-- ui tabs.js -->
<script type="text/javascript" src="/ui.core.js"></script>
<script type="text/javascript" src="/ui.tabs.js"></script>
<link href="/ui.tabs.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function() {
$('#ui-tab > ul').tabs({ fx: { opacity: 'toggle', duration: 'normal' } });
});
</script>
</head>
<div id="ui-tab">
<ul>
<li><a href="#fragment-1"><span>タブ1</span></a></li>
<li><a href="#fragment-2"><span>タブ2</span></a></li>
<li><a href="#fragment-3"><span>タブ3</span></a></li>
</ul>
<div id="fragment-1">
<p>タブ1の内容</p>
</div>
<div id="fragment-2">
<p>タブ2の内容</p>
</div>
<div id="fragment-3">
<p>タブ3の内容</p>
</div>
</div>