用slide实现图片轮播效果

----------需要引用的JS<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script><script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>----------banner层的样式<style>#banner_box{ background:#fff; width:100%; height:500px;padding-top:120px; position:relative; overflow:hidden;}.banner{ width:100%; margin:0 auto; text-align:center; height:auto; position:absolute; left:-1000px; top:120px;}.banner ul{ width:4000px; text-align:center;}.banner ul li{ float:left;}.band_gg{height:500px;position:absolute;top:120px;cursor:pointer;}.ban_left{left:0;background:rgba(255,255,255,0.5) url(../images/prev.png) no-repeat 96% center; display:block; width:55px;}.ban_right{right:0;background:rgba(255,255,255,0.5) url(../images/next.png) no-repeat 4% center; display:block; width:55px;}</style>----------HTML 代码<div id="banner_box"><div class="banner"><ul><li><img src="banner/banner1.png" alt="" width="100%"></li><li><img src="banner/banner2.png" alt="" width="100%"></li><li><img src="banner/banner3.png" alt="" width="100%"></li><li><img src="banner/banner4.png" alt="" width="100%"></li></ul></div> <div class="ban_left band_gg"></div><div class="ban_right band_gg"></div> </div>----------实现banner轮播效果    $(".banner ul").animate({'left':'-50px'},300,function(){        $("#banner_box").slide({        mainCell:".banner ul", //切换元素的包裹层对象        titCell:".banner ul li", //导航元素对象（鼠标的触发元素对象）        prevCell:".ban_left", //前一个/页按钮对象        nextCell:".ban_right",//后一个/页按钮对象        effect:"leftLoop",//动画效果 fade：渐显； || top：上滚动；|| left：左滚动；|| topLoop：上循环滚动；|| leftLoop：左循环滚动；|| topMarquee：上无缝循环滚动；|| leftMarquee：左无缝循环滚动；        trigger:"click",//titCell触发方式 || mouseover：鼠标移过触发；|| click：鼠标点击触发；        autoPlay:true, //自动运行        easing:"easeInOutQuint", //缓动效果 [v2.1]更改默认效果为“swing”，使效果更流畅        delayTime:1000, //毫秒；切换效果持续时间（一次切换效果执行所用的时间长度）        interTime:2000, //毫秒；自动运行间隔。当effect为无缝滚动(topMarquee/leftMarquee)时，相当于运行速度。        defaultPlay:true,//默认是否执行效果（第一次运行是否执行效果）常用于导航/菜单        vis:3,//visible缩写，mainCell的可视范围个数，当实际内容个数少于可视个数的时候，不执行SuperSlide效果。               });             });          //让banner背景左右透明          var wid=$(".banner li:first").width();          var wind=$(window).width();          if ((wind-wid)>0){             $(".banner").css("padding-left",(wind-wid)/2+"px");             $(".band_gg").width((wind-wid)/2);          }else{             $(".band_gg").width(0);          }         $(window).resize(function(){             var wind=$(this).width();             if ((wind-wid)>0){                 $(".banner").css("padding-left",(wind-wid)/2+"px");                 $(".band_gg").width((wind-wid)/2);             }else{               $(".band_gg").width(0);           }                });