结构比较简单，已经封装,本作品为 本站 原创，其中样式借用了jquery的ui-tab的样式
使用方法，
var ceshi4 = new Ztabs({
ChannelId : 'container-1', //通道按钮ID
ChannelTag : 'li', //通道按钮标签
PreId : 'fragment-', //选项卡ID前缀
sc : 'ui-tabs-selected', //选中样式
nsc : 'normal' //未选中样式
})
兼容IE6，7，8（样式有一点问题）,FF1.5，FF3.0
程序调用后只对TAB做监控,默认选中有CSS控制,只有触发事件才会改变选中项
<li class="ui-tabs-selected" onclick="ceshi4.change(this,0);"><a href="#fragment-1"><span>One</span></a></li>
onmouseover="ceshi4.change(this,0);" 参数0对应的是id为fragment-0的对象(因为这里设置了 PreId : 'fragment-', //选项卡ID前缀fragment-)
默认
要用程序激活指定的tab，只需要：ceshi4.change('t_1',1); //其中ceshi4是实例名，后面的1是从0开始的序号，这里有一个例子：
点这里激活第一个TAB的第二个
JS 写法 :
var ceshi4 = new Ztabs({
ChannelId : 'container-1', //通道按钮ID
ChannelTag : 'li', //通道按钮标签
PreId : 'fragment-', //选项卡ID前缀
sc : 'ui-tabs-selected', //选中样式
nsc : 'normal' //未选中样式
})
demo 结构 :
<div id="container-1">
<ul class="ui-tabs-nav">
<li class="ui-tabs-selected" onclick="ceshi4.change(this,0);"><a href="#fragment-1"><span>One</span></a></li>
<li class="" onclick="ceshi4.change(this,1);"><a href="#fragment-2"><span>Two</span></a></li>
<li class="" onclick="ceshi4.change(this,2);"><a href="#fragment-3"><span>Three</span></a></li>
</ul>
<div style="display: block;" class="ui-tabs-panel ui-tabs-hide" id="fragment-0">
<p>First tab</p>
</div>
<div class="ui-tabs-panel ui-tabs-hide" id="fragment-1">
<p>Second tab</p>
</div>
<div class="ui-tabs-panel ui-tabs-hide" id="fragment-2">
<p>Third tab</p>
</div>
</div>