aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaa
aaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaa
bbbbbbbbbbbbbbbbbbbbbb
bbbbbbbbbbb
bbbbbbbbbbb
ddddddddddddddddddddddddddddddddddddddd
ddddddddddddddddddddddddddddddddddd
ddddddddddddddddddddddddddddddddd
ddddddddddddddddddddddddddddddd
eeeeeeeeeeeeeeeeeeeeee
eeeeeeeeeeeeeeeeeeeeee
eeeeeeeeeeeeeeeeeeeeee
tabControl.jsの30~40行目付近の設定値に、タブのナビゲーション部のIDをセットする。
//-----------------------------------------
// 設定値
//-----------------------------------------
conf : {
// ナビゲーションのID
tabNavId : 'tabNav',
// デフォルトアクティブとする要素に付加するクラス名
activeCls : 'activeTab',
続いて同部分下部にある設定値に、コンテンツ切り替え時の速度をセットする。
// タブ切り替えの際に表示中コンテンツを非表示にする速さ
hideHeightSpeed : 35,
// タブ切り替えの際に非表示コンテンツを表示にする速さ
viewSpeed : 40,
以下の形式でhtmlをマークアップする。
<ul id="tabNav">
<li class="activeTab"><a href="#tabContents01"><img src="images/tab01_n.gif" alt="" width="80" height="24" /></a></li>
<li><a href="#tabContents02"><img src="images/tab02_n.gif" alt="" width="80" height="24" /></a></li>
<li><a href="#tabContents03"><img src="images/tab03_n.gif" alt="" width="80" height="24" /></a></li>
<li><a href="#tabContents04"><img src="images/tab04_n.gif" alt="" width="80" height="24" /></a></li>
<li><a href="#tabContents05"><img src="images/tab05_n.gif" alt="" width="80" height="24" /></a></li>
</ul>
<div id="tabContents01">
:
コンテンツ
:
</div>
<div id="tabContents02">
:
コンテンツ
:
</div>
<div id="tabContents03">
:
コンテンツ
:
</div>
<div id="tabContents04">
:
コンテンツ
:
</div>
<div id="tabContents05">
:
コンテンツ
:
</div>