[tabmenuライブラリ] タブメニューを表示する
説明
tabmenuライブラリでタブメニューを表示するには、あらかじめHTMLタグに決められたdiv、ul、liタグを記述しておきます。タブとなるulタグにはid="tabMenu"を指定します。liタグのclass属性にselectedを指定すると、そのタブが最初から選択された状態になります（この場合、タブ内容を囲むdivタグには念のためclass="show"を指定しておきます）。
タブの内容はdivタグ内にul、liを記述しますが、一番最後の項目にはclass="last"を指定しておきます。あとは自動的にタブメニューが機能します。
サンプルプログラム
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Sample</title>
<link rel="stylesheet" href="css/tabmenu.css" type="text/css" media="all">
<link rel="stylesheet" href="css/main.css" type="text/css" media="all">
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/tabmenu.js"></script>
</head>
<body>
<h1>タブメニュー</h1>
<div class="box">
<ul id="tabMenu">
<li class="menu1 selected"></li>
<li class="menu2"></li>
<li class="menu3"></li>
</ul>
<div class="boxTop"></div>
<div class="boxBody">
<div id="menu1" class="show">
<ul>
<li>メニュー項目1-1</li>
<li>メニュー項目1-2</li>
<li>メニュー項目1-3</li>
<li>メニュー項目1-4</li>
<li class="last">メニュー項目1-4</li>
</ul>
</div>
<div id="menu2">
<ul>
<li>メニュー項目2-1</li>
<li>メニュー項目2-2</li>
<li>メニュー項目2-3</li>
<li>メニュー項目2-4</li>
<li>メニュー項目2-5</li>
<li>メニュー項目2-6</li>
<li>メニュー項目2-7</li>
<li class="last">メニュー項目2-8</li>
</ul>
</div>
<div id="menu3">
<ul>
<li>メニュー項目3-1</li>
<li>メニュー項目3-2</li>
<li>メニュー項目3-3</li>
<li class="last">メニュー項目3-4</li>
</ul>
</div>
</div>
<div class="boxBottom"></div>
</div>
</body>
</html>】