做图片轮播一直采用的是SuperSlide：
<div /></a></li>
</ul>
</div>
<!-- 下面是前/后按钮代码，如果不需要删除即可 -->
<a class="prev" href="javascript:void(0)"></a>
<a class="next" href="javascript:void(0)"></a>
</div>
<script type="text/javascript">
jQuery(".slideBox").slide({mainCell:".bd ul",autoPlay:true,effect:"leftLoop",delayTime:1000});
</script>
优点是兼容包括ie6的绝大部分浏览器，可通过将.slideBox及.slideBox .bd img的宽度设为100%，高度不设置来实现自适应。缺点是该控件时间较久，未考虑到移动端的情况，不支持手滑功能。
而基于jquery的插件SlidesJS则能很好地解决这个问题：
SlidesJS is a responsive slideshow plug-in for jQuery (1.7.1+) with features like touch and CSS3 transitions.
responsive、touch、css3很令人激动有木有？时尚、先进、好用！特别是在手机端手滑效果爽呆了，这为我们更好地用h5伪装原生app做出一大贡献。
参数和运用都比较简单：
css部分：
<!-- SlidesJS Required: These styles are required if you'd like a responsive slideshow -->
<style>
#slides {
display: none
}
.container {
width: 100%;
margin: 0 auto
}
</style>
html部分：
<!-- SlidesJS Required: -->
<!-- SlidesJS Required: Start Slides -->
<!-- The container is used to define the width of the slideshow -->
<div class="container">
<div ></i></a>
</div>
</div>
<!-- End SlidesJS Required: Start Slides -->
<!-- SlidesJS Required: Link to jQuery -->
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!-- End SlidesJS Required -->
<!-- SlidesJS Required: Link to jquery.slides.js -->
<script src="js/jquery.slides.min.js"></script>
<!-- End SlidesJS Required -->
<!-- SlidesJS Required: Initialize SlidesJS with a jQuery doc ready -->
js部分，初始化插件：
<script>
$(function() {
$('#slides').slidesjs({
width: 940,
height: 528,
navigation: false,
play: {
active: false,
// [boolean] Generate the play and stop buttons.
// You cannot use your own buttons. Sorry.
effect: "slide",
// [string] Can be either "slide" or "fade".
interval: 5000,
// [number] Time spent on each slide in milliseconds.
auto: true
}
});
});
</script>
<!-- End SlidesJS Required -->
注：container为slide的容器，实际的图片宽度由它来决定，因此我们要自适应，只需对.container设置width: 100%，初始化时设置$('#slides').slidesjs({width: 940,height: 528 })具体的宽高数值不会产生影响。