js无缝滚动

//$('.news-list').width($('.nw-wraper').width());
var timer = null,
    $newBox = $('.nw-box'),//元素盒子
    $items = $newBox.children(),//子元素
    $pre = $('.news-prev'),
    $next = $('.news-next'),
    oldCount = $items.size(),//子元素长度
    //imgWidth = $('.news-list').eq(0).width();
        imgWidth = $items.width();//单个子元素宽度
    $newBox.append($items.first().clone());//克隆，方便切换
    $newBox.prepend($items.last().clone());
var    newCount = $newBox.children().size();//子元素新长度
    $newBox.css({
        'left':0-imgWidth,
        'width':imgWidth*newCount
    })
timer=setInterval(init,3000);
// 初始化
function init(){
    $pre.trigger('click'); 
} 
// hover
$(".nw-wraper").hover(function(){
    clearInterval(timer);
},function(){
    timer=setInterval(init,3000);
});
$next.on('click',function(){
    playNext();
})
$pre.on('click',function(){
    playPre();
})

var move = 1,
    curidx = 0;
function playNext(){
    $newBox.animate({
        'left':'-='+move*imgWidth
    },function(){
        curidx+=move;
        if(curidx==oldCount){
            $newBox.css({
                'left':0-imgWidth
            })
            curidx=0;
        }
    })
}

function playPre(){
    $newBox.animate({
        'left':'+='+move*imgWidth
    },function(){
        curidx-=move;
        if(curidx==(-1)){
            $newBox.css({
                'left':0-imgWidth*oldCount
            })
            curidx = oldCount-1;
        }
    })
}

 

<div class="nw-wraper">
    <div class="nw-box">
    <!-- donghua -->
        <div class="news-list">
            <a href="javascript:;">1</a>
        </div>
        <div class="news-list">
            <a href="javascript:;">2</a>
        </div>
        <div class="news-list">
            <a href="javascript:;">3</a>
        </div>
        <div class="news-list">
            <a href="javascript:;">4</a>
        </div>
    </div>
    <!-- 分页按钮 -->
    <div class="news-dir">
        <div class="news-mao news-prev"><span class="fa-angle-left"></span></div>
        <div class="news-mao news-next"><span class=" fa-angle-right"></span></div>
    </div>
</div>

.nw-wraper
.news-list{
    width: 600px;
    height: 300px;
    overflow: hidden;
    position: relative;
}
.nw-box{
    width: 1000%;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
}
.news-list{
    float: left;
}