两款 jQuery Tabs 选项卡插件推荐

一、jQuery Tabs

jQuery Tabs 是 jQuery 的插件。它具有垂直滚动,水平滚动 ,点击触发,划过触发和自动切换等效果。

jQuery Code:

<script type="text/javascript" src="js/jquery.tab.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("#tab").tab({
        //dft:0,  // 起始显示项,默认为第一项
        //auto:true,  // 自动切换,默认为关闭
        //act:"mouseover",  // 鼠标划过,默认为单击
        //effact:" scrollx",  // 横向滚动效果,纵向滚动为 scrolly
        //effact:"slow",  // "slow" 效果
        tabId: ".tags",  // 切换控制器
        tabTag: "li",  // 切换控制器标签
        conId: ".panes",  // 内容容器
        conTag: ".pane"  // 内容容器标签
    })
})
</script>

xhtml Code:

<div id="tab">
  <ul class="tags">
    <li>项目一</li>
    <li>项目二</li>
    <li>项目三</li>
  </ul>
  <div class="panes">
    <div class="pane"> 项目一内容 </div>
    <div class="pane"> 项目二内容 </div>
    <div class="pane"> 项目三内容 </div>
  </div>
</div>

二、jQuery idTabs

idTabs 是 jQuery 的插件。它能非常容易的为网站添加选项卡,也为无穷尽的可能性敞开大门。

idTabs

《两款 jQuery Tabs 选项卡插件推荐》有3个想法

发表评论

电子邮件地址不会被公开。 必填项已用*标注