网友小鸟分享原创jquery选项卡插件
JquerySchool
网站出品（
http://www.jq-school.com
）
（
Jquery学堂交流社区
）
官方网站学习交流QQ群
标签一
标签二
标签三
内容一
内容二
内容三
引用JS
<script type="text/javascript" src="js/jquery.fxTab.js"></script> //根据项目修改js地址，也可以提取出来。
参数列表
参数名
类型
描述
默认值
tit
Object
点击的标签对象
点击的标签对象Class为'.fxui-tab-tit'
nav
Object
显示的标签对象
显示的标签对象Class为'.fxui-tab-nav'
evt
String
切换的事件名称:可以传click,hover,mouseover
click
Int
当前选中
0代表第一个，1代表第二个以此类推
0
示例代码一
<div class="fxui-tab"> <div class="fxui-tab-hand"><span class="fxui-tab-tit">标签一</span> <span class="fxui-tab-tit">标签二</span> <span class="fxui-tab-tit">标签三</span></div> <div class="fxui-tab-nav">内容一</div> <div class="fxui-tab-nav">内容二</div> <div class="fxui-tab-nav">内容三</div> </div> <script type="text/javascript"> $('.fxui-tab').fxuiTab(); </script>
示例代码二
<div class="fxui-tab"> <div class="fxui-tab-hand"><span>标签一</span> <span>标签二</span> <span>标签三</span></div> <div class="fxui-tab-nav">内容一</div> <div class="fxui-tab-nav">内容二</div> <div class="fxui-tab-nav">内容三</div> </div> <script type="text/javascript"> $('.fxui-tab').fxuiTab( { tit: $('.fxui-tab').find('span') } ); </script>
示例代码三
<div class="fxui-tab"> <div class="fxui-tab-hand"><span>标签一</span> <span>标签二</span> <span>标签三</span></div> <div class="fxui-tab-nav">内容一</div> <div class="fxui-tab-nav">内容二</div> <div class="fxui-tab-nav">内容三</div> </div> <script type="text/javascript"> $('.fxui-tab').fxuiTab( { tit: $('.fxui-tab').find('span'), nav: $('.fxui-tab').find('.fxui-tab-nav'), evt: 'hover', eq : 1 } ); </script>
