自已动手写的轮播图插件，功能不断增加中，可以下载

<!-- carousel begin -->
<div class="carousel-wrap">
    <div class="carousel-main-wrap">
        <ul class="carousel-scroll-wrap">
            <li><img src="images/1.jpg" ></li>
            <li><img src="images/2.jpg" ></li>
            <li><img src="images/3.jpg" ></li>
            <li><img src="images/4.jpg" ></li>
            <li><img src="images/5.jpg" ></li>
            <li><img src="images/6.jpg" ></li>
            <li><img src="images/7.jpg" ></li>
            <li><img src="images/8.jpg" ></li>
        </ul>
        <span class="carousel-left">向左</span>
        <span class="carousel-right">向右</span>
    </div>
</div>
<!-- carousel end -->

/* css reset start*/

@charset "UTF-8";
*{
    padding:0;
    margin:0;
    list-style:none;
    border:0;
}
body{
    width: 100%;
    font-family: ‘SimSun‘, ‘Microsoft YaHei‘, Arial;
    font-size: 14px;
    color: #fff;
}
a,a:visited{
    color: #fff;
    text-decoration: none;
}
a:hover{
   text-decoration: none;
}
img{
    display: block;
}
/* css reset end */


/* carousel start */
.carousel-wrap{
    width: 800px;
    height: 504px;
    margin: 0 auto;
    
}
.carousel-main-wrap{
    overflow: hidden;
    position: relative;
}
.carousel-scroll-wrap{
    position: relative;
}
.carousel-scroll-wrap li{
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 10000px;
}
.carousel-scroll-wrap li img{
    width: 800px;
    height: 504px;
    display: block;
}
.carousel-left{
    width: 50px;
    height: 100px;
    margin-top: -50px;
    line-height: 100px;
    text-align: center;
    color: #fff;
    background-color: teal;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    cursor: pointer;
}
.carousel-right{
    width: 50px;
    height: 100px;
    margin-top: -50px;
    line-height: 100px;
    text-align: center;
    color: #fff;
    background-color: teal;
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    cursor: pointer;
}
.carousel-control{
    height: 10px;
    overflow: hidden;
}
.carousel-control span{
    width: 20%;
    height: 10px;
    display: inline-block;
    background-color: orange;
    cursor: pointer;
}
.carousel-control span.cur{
    background-color: #f60;
}
/* carousel end */

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>

<script type="text/javascript" src="js/carousel.js"></script>

carousel.js代码如下：

function carouselPlay(config){


//设置变量默认数据
    var carouselSpeed = config.carouselSpeed || 800;
    var carouselFuncton = config.carouselFuncton || ‘swing‘;
    var imgWidth = config.imgWidth || 400;
    var imgHeight = config.imgHeight || 304;
//以下为常量，一般不必改动
    var carouselLi = (′.carousel−scroll−wrapli′);varcontrolSpan=(′.carousel−scroll−wrapli′);varcontrolSpan=(‘.carousel-control span‘);
    var carouselCount = carouselLi.index()+1;
    var curLeft = imgWidth;
    var nextLeft = imgWidth*2;
    var prevLeft = 0;
    var outLeft = 10000;
    var curIndex = 0;
    var nextIndex = 1;
    var prevIndex = carouselCount-1;
//初始化
    var jobInite = function(){
        (′.carousel−main−wrap′).css(width:imgWidth,height:imgHeight);(′.carousel−main−wrap′).css(width:imgWidth,height:imgHeight);(‘.carousel-scroll-wrap‘).css({
            width: imgWidth*3,
            height: imgHeight,
            left: -imgWidth,
            top: 0
        });        
        carouselLi.eq(curIndex).css(‘left‘, curLeft);
        carouselLi.eq(nextIndex).css(‘left‘, nextLeft);
        carouselLi.eq(prevIndex).css(‘left‘, prevLeft);
    }
    jobInite();
//向右滚动一张的逻辑
    function rightZero(a){
        a++;
        if(a == carouselCount){
            a = 0;
        }
        return a
    }
//向左滚动一张的逻辑
    function leftZero(a){
        a--;
        if(a == -1){
            a = carouselCount-1;
        }
        return a
    }
// 小圆点控制图片切换的逻辑，小点控制功能还未写完，但不影响其它功能！
    function controlZero(a){
        curIndex = a;
        if(a === (carouselCount-1)){
            nextIndex = 0;
        }
        else{
            nextIndex = a+1;
        }
        if(a === 0){
            prevIndex = carouselCount;
        }
        else{
            prevIndex = a-1;
        }        
    }
//滚动函数
    function focusAnimate(carouselLi,index,left){
        carouselLi.eq(index).stop(true,true).animate({‘left‘: left}, carouselSpeed, carouselFuncton);
    }
//处置窗口以外的图片
    function imgOut(carouselLi, index){
        carouselLi.eq(index).css(‘left‘, outLeft);
    }
// 控制按钮函数，功能还未写完，但不影响其它功能！
    function controlPlay(curIndex){
        controlSpan.eq(curIndex).addClass(‘cur‘).siblings().removeClass(‘cur‘);
    }
//向右切换运动
    function rightPlay(){
        //滚动前初始化图片索引
        jobInite();
        //向右切换
        focusAnimate(carouselLi, curIndex, prevLeft);
        focusAnimate(carouselLi, nextIndex, curLeft);
        imgOut(carouselLi, prevIndex);
        //重置索引
        curIndex         = rightZero(curIndex);
        nextIndex         = rightZero(nextIndex);
        prevIndex         = rightZero(prevIndex);
        // 控制小圆点跟随，功能还未写完，但不影响其它功能！
        controlPlay(curIndex);
    }

//向左切换运动
    function leftPlay(){
        //滚动前初始化图片索引
        jobInite();
        //向左
        focusAnimate(carouselLi, curIndex, nextLeft);
        focusAnimate(carouselLi, prevIndex, curLeft);
        imgOut(carouselLi, nextIndex); 
        //重置索引
        curIndex         = leftZero(curIndex);
        nextIndex         = leftZero(nextIndex);
        prevIndex         = leftZero(prevIndex);
        // 控制小圆点跟随，功能还未写完，但不影响其它功能！
        controlPlay(curIndex);
    }

// 限制用户频繁点击
    var datePrev = 0;
    var clickFlag = true;
    function clickCheck(minSecond){
        var nowDate = new Date();
        var dateCur = nowDate.getTime();
        var dateInterval = dateCur - datePrev;
        datePrev = dateCur;
        if(dateInterval<minSecond){
            clickFlag = false;
        }
        else{
            clickFlag = true;
        }
        return clickFlag;
    }
// 左右控制切换
    (′.carousel−right′).click(function(event)if(clickCheck(500))rightPlay(););(′.carousel−right′).click(function(event)if(clickCheck(500))rightPlay(););(‘.carousel-left‘).click(function(event) {
        if(clickCheck(500)){
            leftPlay();
        }
    });
// 小圆点控制切换，功能还未写完，但不影响其它功能！
    controlSpan.mouseover(function(event) {
        // 计算新的当前位置索引
        curIndex = $(this).index();
        //重置索引
        controlZero(curIndex);
        // 初始化图片位置
        jobInite();
        // 小圆点位置跟随
        controlPlay(curIndex);
    });
}

四：在页面中调用

<script type="text/javascript">
$(function(){
//配制变量
var config = {
    ‘carouselSpeed‘: 800,
    ‘carouselFuncton‘: ‘swing‘,
    ‘imgWidth‘: 800,
    ‘imgHeight‘: 504
}
//轮播图的执行
var main = carouselPlay;
main(config);
})

//更多调用可参考demo
</script>