Javascript/jquery自动滚动旋转木马

我想知道如何使用javascript自动滚动以下内容？carousol将使用HTML框放在谷歌网站上，所以我不能只下载jquery插件，这将是最简单的解决方案！Jquery包含在脚本中。任何帮助或建议都将不胜感激！代码如下：

<style>
  .carousel {
  width: 1080px;
  height: 220px;
  position: relative;
  overflow: hidden;
  background-color:black;
  border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  margin-bottom: 20px;
  margin-top: 20px;
 }
 .items {
  width: 1080px;
  position: absolute;
 }
 .items > div {
  font-size: 20px;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
 }
 .items > div > img {
  width: 340px;
  height: 202px;
  padding: 10px;
 }
 .nav {
  position: absolute;
  bottom: 5px;
  right: 15px;
 }
 .button {
  cursor: pointer;
  font-weight: bold;
  color: #fff;
 }
</style>
<div class="carousel" style="display:none;">
 <div class="items">
  <div>
    <img src="http://i58.tinypic.com/2wq5nkk.png" border="0" alt="Speaker at event">
  </div>

  <div>
   <img src="http://i62.tinypic.com/vfii61.png" border="0" alt="Speaker at event">
  </div>
  <div>
    <img src="http://i59.tinypic.com/5ttg0z.png" border="0" alt="Speaker at event">
  </div>
  <div>
    <img src="http://i61.tinypic.com/okpq9g.png" border="0" alt="Speaker at event">
  </div>

  <div>
    <img src="http://i62.tinypic.com/2h4ywbo.png" border="0" alt="Speaker at event">
  </div>
  <div>
    <img src="http://i60.tinypic.com/21oyg4x.png" border="0" alt="Speaker at event">
  </div>
 </div>
 <div class="nav">
  <span class="button left-button">prev</span>
  &nbsp;&nbsp;
  <span class="button right-button">next</span>
 </div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"> </script>
<script>
 var current_slide = 0; // zero-based
 var slide_count = 2;
 var slide_size = 1080;

 var Direction = {
  LEFT: -1,
  RIGHT: 1
 };

 /**
 * Moves to the next slide using the direction (dx) parameter.
 */
 var nextSlide = function(dx) {
  current_slide = (current_slide + slide_count + dx) % slide_count;

  // Calculate the new value for css 'left' property and animate.
  var left_offset = '-' + (current_slide * slide_size) + 'px';
  $('.items').animate({'left': left_offset}, 1080);
 };

 $('.right-button').click(nextSlide.bind(null, Direction.RIGHT));
 $('.left-button').click(nextSlide.bind(null, Direction.LEFT));


 $('.carousel').show();
</script>

旋转木马{
宽度：1080px；
高度：220px；
位置：相对位置；
溢出：隐藏；
背景色：黑色；
边界半径：20px；
-moz边界半径：20px；
-webkit边界半径：20px；
边缘底部：20px；
边缘顶部：20px；
}
.项目{
宽度：1080px；
位置：绝对位置；
}
.items>div{
字体大小：20px；
显示：表格单元格；
垂直对齐：中间对齐；
文本对齐：居中；
}
.items>div>img{
宽度：340px；
高度：202px；
填充：10px；
}
.导航{
位置：绝对位置；
底部：5px；
右：15px；
}
.按钮{
光标：指针；
字体大小：粗体；
颜色：#fff；
}
上
下一个
var current_slide=0；//零基
var滑动计数=2；
var slide_size=1080；
变量方向={
左：-1，
右：1
};
/**
*使用方向（dx）参数移动到下一张幻灯片。
*/
var nextSlide=函数（dx）{
当前幻灯片=（当前幻灯片+幻灯片计数+dx）%幻灯片计数；
//计算css“left”属性的新值并设置动画。
var left_offset='-'+（当前_幻灯片*幻灯片大小）+“px”；
$（'.items'）.animate（{'left'：left_offset}，1080）；
};
$（'.right button'）。单击（nextSlide.bind（null，Direction.right））；
$（'.left button'）。单击（nextSlide.bind（null，Direction.left））；
$（'.carousel'）.show（）；

最简单的方法是添加一个间隔，反复调用nextSlide

var nextSlide = function(dx) {
  current_slide = (current_slide + slide_count + dx) % slide_count;

  // Calculate the new value for css 'left' property and animate.
  var left_offset = '-' + (current_slide * slide_size) + 'px';
  $('.items').animate({'left': left_offset}, 1080);
 };

 $('.carousel').show();

setInterval(function(){
    nextSlide(Direction.LEFT);
}, 5000); // Will call nextSlide every 5 seconds