step 1:导入css样式
<link href="css/flexslider.css" rel="stylesheet" type="text/css"/>//引入flexslider的css样式表
step 2:构建轮播器
//轮播器start
<div class="flexslider">//必须引用的flexslider类
<ul class="slides">//必须引用的slides类
<li><a href="#"><img src="images/calrousel1.jpg"></a></li>
<li><a href="#"><img src="images/calrousel2.jpg"></a></li>
<li><a href="#"><img src="images/calrousel3.jpg"></a></li>
<li><a href="#"><img src="images/calrousel4.jpg"></a></li>
<li><a href="#"><img src="images/calrousel5.jpg"></a></li>
</ul>
</div>
//轮播器end
step3:导入jQuery 和flexslider核心js
<script src="js/jQuery.1.7.1.min.js"></script>//导入jQuery核心js
<script src="js/jquery.flexslider.js"></script>//导入flexslides核心js
最后一步:启动轮播器
<script>
$('document').ready(function(){
//最后一步启动轮播器
$('.flexslider').flexslider();
});
</script>