<!-- 轮播图切换 -->
<div class="slide-banner" style="width: 100%; height: 700px;">
<a href="javascipt:void(0);" class="slide-btn prev"><</a>
<a href="javascipt:void(0);" class="slide-btn next">></a>
<ul class="slide-num">
<span class="active"></span>
<span></span>
<span></span>
<span></span>
<span></span>
</ul>
<ul class="slide-pic">
<li><a href="javascript:;"><img src="assets/images/Dark-1.jpg" alt=""></a></li>
<li><a href="javascript:;"><img src="assets/images/Dark-2.jpg" alt=""></a></li>
<li><a href="javascript:;"><img src="assets/images/Dark-3.jpg" alt=""></a></li>
<li><a href="javascript:;"><img src="assets/images/Dark-5.jpg" alt=""></a></li>
<li><a href="javascript:;"><img src="assets/images/Dark-6.jpg" alt=""></a></li>
</ul>
</div>
// 轮播图JS调用
main.Slide.init('.slide-banner',{ // 外层容器
mainCell: '.slide-pic', // 切换对象
titCell: '.slide-num span', // 导航元素
effect: 'left', // 切换动画
autoPlay: true, // 自动运行
nterTime: 3000, // 毫秒;自动运行间隔
titOnClassName: 'active' // 当前类
})
<!-- 选项卡切换 -->
<div class="slide-tab">
<ul class="tab-head">
<li class="active" style="width: 20%;">
<a href="javascript:;" class="head-item">
<h4 class="name">律师</h4>
</a>
</li>
<li style="width: 20%;">
<a href="javascript:;" class="head-item">
<h4 class="name">律师</h4>
</a>
</li>
<li class="active" style="width: 20%;">
<a href="javascript:;" class="head-item">
<h4 class="name">律师</h4>
</a>
</li>
<li class="active" style="width: 20%;">
<a href="javascript:;" class="head-item">
<h4 class="name">律师</h4>
</a>
</li>
<li class="active" style="width: 20%;">
<a href="javascript:;" class="head-item">
<h4 class="name">律师</h4>
</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-panel">
a
</div>
<div class="tab-panel">
b
</div>
<div class="tab-panel">
c
</div>
<div class="tab-panel">
d
</div>
<div class="tab-panel">
e
</div>
</div>
</div>
// 选项卡JS调用
main.Slide.init('.slide-tab',{
titCell : '.tab-head li', // 导航元素
mainCell : '.tab-content', // 切换对象
titOnClassName : 'active', // 当前类
effect:"top" // 切换方向
});