第39款插件：jquery.flexslider.js带左右箭头且带按钮可滚动的图片插件

一、插件介绍

FlexSlider是一个非常出色的jQuery滑动切换插件，它支持所有主流浏览器，并有淡入淡出效果。FlexSlider对于网站开发者来说是一个不错测JQUERY特效，因为支持全浏览器深受中国网站前端开发者的喜爱！

二、插件图片、DEMO及下载

1、带有左右按钮、小圆点儿的轮播图

2、全屏轮播图片

3、FlexSlider制作新浪2014成都车展幻灯片演示

三、插件作者下载地址

兼容浏览器：IE6+/Firefox/Google Chrome

官方链接：http://www.woothemes.com/flexslider/

JS下载：http://www.ijquery.cn/js/flexslider/jquery.flexslider.js

预览： http://www.ijquery.cn/study/demo/flexslider

打包下载： http://www.ijquery.cn/study/demo/flexslider/flexslider.zip

五、最简使用教程

JS和CSS引用代码：

<script type="text/javascript" src="http://www.ijquery.cn/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="http://www.ijquery.cn/js/flexslider/jquery.flexslider.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.ijquery.cn/js/flexslider/flexslider.css" media="all" />
<script type="text/javascript" >
$(function(){
$(‘.flexslider’).flexslider();
});
</script>

HTML代码：这里一定要控制div的宽度！

<div style="width:500px;height:315px;">
<ul>
<li><img src="images/slide1.jpg"/></li>
<li><img src="images/slide2.jpg"/></li>
<li><img src="images/slide3.jpg"/></li>
</ul>
</div>

五、参数说明：