$(document).ready(function() {
  var length = $(".content_1").children(".box").length;//盒子个数
  var boxwidth = $(".bigbox").width() / 4;//视窗宽度除以4获得移动宽度
  var virtual = length * boxwidth;	//切换的临界点
  var speed = 500;	//移动速度，速度建议要小于间隔时间的一半。
  var time =4000;	//间隔时间
  $(".box").width(boxwidth-3);

  var item = $('#switcher'); //要移动的元素
  item.css({ position: 'relative' }); //设置position
  var move = boxwidth + 'px'; //移动的范围，是一个box的宽度。
  var leftcriticalpoint = "-" + virtual + "px"; //有n个盒子，就以n个盒子的长度作为跳跃点

  var flag = true;//点击允许

  scrollcontentstructure(length);

  function scrollcontentstructure(length) {
    if(length < 4) {
      $('#switcher').width(boxwidth * (length + 4)); //视窗宽度 条状体l+4，补体6-l；假设l=3，条状体7.补体3
      if(length != 0) {
        var content_1 = $(".content_1").html();
        for(var i = 0; i < 6 - length; i++) {
          $(".content_1").append(content_1); //最少6个盒子，补够
        }
      }
    } else {
      $('#switcher').width(virtual * 2);
      $(".content_2").html($(".content_1").html()); //复制
    }
  }

  if(length != 0) {
    var callback = setinterval(moving, time);
  }

  function moving() {
    flag = false;
    if(item[0].style.left == leftcriticalpoint) {
      item[0].style.left = "0px";
    }
    item.animate({ left: '-=' + move }, speed, function() {
      if(item[0].style.left == leftcriticalpoint) {
        item[0].style.left = "0px";
      }
    });
    flag = true;
  }

  $("li").click(function() {
    //当前处于动画状态及可点击状态判断
    //标志位防止事件栈积累，
    if(!item.is(":animated") && flag) {
      var left = item[0].style.left;
      clearinterval(callback);

      if($(this).index() == 1) {
        if(left == leftcriticalpoint) {
          item[0].style.left = "0px";
        }
        item.animate({ left: '-=' + move }, speed, function() {
          if(item[0].style.left == leftcriticalpoint) {
            item[0].style.left = "0px";
          }
          callback = setinterval(moving, time);
        });
        // console.log("右");
      } else if($(this).index() == 0) {
        if(isnan(parseint(left)) || left == "0px") {
          item[0].style.left = leftcriticalpoint;
        }
        item.animate({ left: '+=' + move }, speed, function() {
          if(item[0].style.left == "0px") {
            item[0].style.left = leftcriticalpoint;
          }
          callback = setinterval(moving, time);
        });
        // console.log("左");
      }
    }
  });

})