现在搞得差不多清楚了:
1.只用载入一个Js文件;<script type="text/javascript" src="jquery.flexslider-min.js"></script>
2.html的必要结构如下:
<div class="slider-wrapper flexslider ">//外层是用来放在Jquery参数里面的
<div class="slider-content slides">//这个slides类是必须的,但是不一定要ul标签
<li class="image">//这个li标签一定是必须的
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
<li class="image">
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
<li class="image">
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
<li class="image">
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
<li class="image">
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
<li class="image">
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
<li class="image">
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
<li class="image">
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
<li class="image">
<img src="./images/examples/home/new/home-slider-new-01.jpg">
</li>
</div>
</div>
3.js部分
(function($) {
$(function() {
$('.flexslider').flexslider({
animation: "slide",
animationLoop: true,
itemWidth: 150,
itemMargin: 10
});
4.自定义导航按钮:
$('.arrow.left').click(function(){
$('.flex-prev').click();
});
$('.arrow.right').click(function(){
$('.flex-next').click();
});