引入4个文件
<script src="YIQI-UI/jquery-2.1.1.min.js"></script>
<link href="YIQI-UI/YIQI-UI.css" rel=stylesheet>
<link type="text/css" href="plus/tab/js_tab.css" rel="stylesheet" />
<script src="plus/tab/js_tab.js"></script>
<div class="mt-tabpage" js-tab="2">
<div class="mt-tabpage-title">
<a href="javascript:;" class="mt-tabpage-item mt-tabpage-item-cur">公告</a>
<a href="javascript:;" class="mt-tabpage-item">决定</a>
<a href="javascript:;" class="mt-tabpage-item">会议</a>
</div>
<div class="mt-tabpage-count">
<ul class="mt-tabpage-cont__wrap">
<li class="mt-tabpage-item">Cont1</li>
<li class="mt-tabpage-item">Cont2</li>
<li class="mt-tabpage-item">Cont3</li>
</ul>
</div>
</div>
<div class="mt-tabpage" js-tab="3">
<div class="mt-tabpage-title">
<a href="javascript:;" class="mt-tabpage-item mt-tabpage-item-cur">公告</a>
<a href="javascript:;" class="mt-tabpage-item">决定</a>
<a href="javascript:;" class="mt-tabpage-item">会议</a>
</div>
<div class="mt-tabpage-count">
<ul class="mt-tabpage-cont__wrap">
<li class="mt-tabpage-item">Cont1</li>
<li class="mt-tabpage-item">Cont2</li>
<li class="mt-tabpage-item">Cont3</li>
</ul>
</div>
</div>
<script type="text/javascript">
$(function () {
$('[js-tab=2]').tab({
mouse: 'over', //切换方式:over,click
autoPlay: true, //播放方式:false,true
curDisplay: 1, //当前第一个打开
changeMethod: 'horizontal' //切换选项:默认default,horizontal,vertical,opacity这4种方式
});
$('[js-tab=3]').tab({
curDisplay: 2,
changeMethod: 'horizontal'
});
});
</script>