jQuery旋转木马图片轮播插件carousel.js

    carousel.js是一款基于jQuery库的旋转木马图片轮播插件，始终一张图片在最前面，其他图片分布在两侧，以一定比例缩小，像3D效果的旋转木马一样轮播图片。用在网站的banner上会比较炫酷。
    carousel.js理论上支持无数张图片，只要放到carousel容器中即可，但最少两张，不然无法切换。 1、在css中加入下面的代码，对carousel进行一个基本的布局：

#carousel {
      position: relative;
      z-index: 2;
      height: 200px;
      margin-top: 200px;
      transform-style: preserve-3d;
      perspective: 800px;
 }
    #carousel img {
      position: absolute;
      left: 50%;
      top: 50%;
      width: 300px;
      height: 200px;
      margin-left: -150px;
      margin-top: -100px;
      border-radius: 8px;
      transition: transform 0.5s ease-in-out;
 }

2、在需要使用本插件的地方加入下面的代码：

<div id="carousel">
    <img src="images/1.png">
    <img src="images/2.png">
    <img src="images/3.png">
    <img src="images/4.png">
    <img src="images/5.png">
</div>

3、引用相关js，并进行插件初始化：

<script src="https://5.jimth.com/download/jquery/jQuery-1.10.2.min.js"></script>
<script src="jquery.carousel.js"></script>
<script>
    $(function () {
        $('#carousel').carousel({curDisplay: 0, autoPlay: true, interval: 3000});
    });
</script>

4、本旋转木马插件，仅支持三个参数：
    curDisplay : 当前显示页
    autoPlay  ： 自动轮播
    interval    ： 自动轮播间隔时间