console
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>无缝滚动</title>
</head>
<style>
*{
margin:0;
padding: 0
}
ul{
list-style: none;
}
.main{
width: 620px;
height: 100px;
border: 1px solid #ccc
}
.main ul li{
margin-left: 2px;
float: left;
width:100px;
height: 100%;
text-align: center;
line-height: 100px;
background-color: red
}
.main ul li:nth-of-type(2n){
background-color: blue
}
</style>
<body>
<div class="main">
<ul>
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</div>
</body>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(function(){
var timer;
var div_width = $('.main ul li').first().width()
timer = setInterval(function(){
$('.main ul').stop(true).animate({'marginLfet': -div_width},500,function(){
$('.main ul li').first().appendTo('.main ul')
$('.main ul').css('marginLeft', 0)
})
},1000)
})
</script>
</html>