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

基本

JavaScript

<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.flexslider-min.js"></script>
<script type="text/javascript">
	$(function() {
		$(".flexslider").flexslider({
			slideshowSpeed: 4000, //展示时间间隔ms
			animationSpeed: 400, //滚动时间ms
			touch: true //是否支持触屏滑动
		});
	});	
</script>

HTML

<div class="flexslider" style="width:500px;margin-left:110px;">
	<ul class="slides">
		<li><img src="images/s1.jpg" /></li>
		<li><img src="images/s2.jpg" /></li>
		<li><img src="images/s3.jpg" /></li>
		<li><img src="images/s4.jpg" /></li>
	</ul>
</div>

CSS

<link rel="stylesheet" type="text/css" href="css/flexslider.css" />