JS旋转木马特效

一款JS旋转木马特效，类似与旋转木马的层叠效果，最前面的一张为大图显示，后面的图片依次堆叠前面图片的后面，通过左右箭头的按钮来控制图片的旋转切换。

分类：图片代码 > 图片轮播难易：初级

查看演示下载资源下载积分： 20 积分

页面的head部分，需引入页面的样式文件和轮播的JS插件，代码如下：

<link type="text/css" rel="stylesheet" href="css/css.css"/>
<script type="text/javascript" src="js/animate.js"></script>
<script type="text/javascript" src="js/carousel.js"></script>

页面的body部分，需在div容器里设置好ul无序列表来显示轮播图片，代码如下：

<div class="wrap" id="wrap">
    <div class="slide" id="slide">
        <ul>
            <li><a href="#"><img src="images/slidepic1.png" alt=""/></a></li>
            <li><a href="#"><img src="images/slidepic2.png" alt=""/></a></li>
            <li><a href="#"><img src="images/slidepic3.png" alt=""/></a></li>
            <li><a href="#"><img src="images/slidepic4.png" alt=""/></a></li>
            <li><a href="#"><img src="images/slidepic5.png" alt=""/></a></li>
        </ul>
        <div class="arrow" id="arrow">
            <a href="javascript:;" class="prev" id="arrLeft"></a>
            <a href="javascript:;" class="next" id="arrRight"></a>
        </div>
    </div>
</div>