jQuery Tabs插件 (选项卡插件) --推荐

三款 jQuery Tabs 选项卡插件推荐,效果请看:http://basketball.titan24.com/nba/focus/kikx/jQtab.html

一、jQuery Tab

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

jQuery Code:

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

xhtml Code:

1 <divid="tab">
2 <ul class="tags">
3 <li>项目一</li>
4 <li>项目二</li>
5 <li>项目三</li>
6 </ul>
7 <div class="panes">
8 <div class="pane"> 项目一内容 </div>
9 <div class="pane"> 项目二内容 </div>
10 <div class="pane"> 项目三内容 </div>
11 </div>
12 </div>

二、jQuery idTabs

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

三、jQuery tools tabs(GOOD)

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

你可能感兴趣的:(jquery)