jquery 利用animate完成左右轮流切换图片

html部分

<div class="bag3 panel">  <div class="bg3_content">      <div class="bg3_img">          <div class="first2">              <div class="img_top">                 <div></div>                  <div></div>                  <div></div>                  <div></div>                  <div></div>

</div>              <div class="img_middle">                  <div></div>                  <div></div>                  <div></div>                  <div></div>                  <div></div>

</div>              <div class="img_bottom">                  <div></div>                  <div></div>                  <div></div>                  <div></div>                  <div></div>              </div>          </div>          <div class="second2">              <div class="img_top">                  <div></div>                  <div></div>                  <div></div>                  <div></div>                  <div></div>

</div>              <div class="img_middle">                  <div></div>                  <div></div>                  <div></div>                  <div></div>                  <div></div>

</div>              <div class="img_bottom">                  <div></div>                  <div></div>                  <div></div>                  <div></div>                  <div></div>              </div>          </div>          </div>

</div>    <div class="next_left"></div>    <div class="next_right"></div>    <div class="next1" ><div><a>|</a></div></div>  </div>

css部分

.bg3_content{    height: 385px;    width: 60%;    position: absolute;    left: 310px;    bottom: 148px;   overflow: hidden;}

.bg3_img{    width: 2400px;    height: 100%;    position: absolute;    left: 0;    top: 0;    font-weight:bold;">purple;

}.first2,.second2{     width: 900px;    height: 100%;   position: absolute;}.first2{    position: absolute;    top: 0px;    left: 0px;}.second2{    position: absolute;    top: 0px;    left: 900px;}

/*第四屏左右切换*/   var num=1  $(".next_left").click(function(){     ///  alert(num)         if(num==1){             $(".second2").css("left","-900px");             $(".first2").animate({left:"900px"},500,function () {                 num++;

});            $(".second2").animate({left:"0px"},500,function () {

// $(".first2").css("marginLeft","900px");             });         } if(num==2){          $(".first2").css("left","-900px");           $(".second2").animate({left:"900px"},500,function () {                num=1              $(".second2").css("left","900px");           });           $(".first2").animate({left:"0px"},500,function () {

});       }

});   $(".next_right").click(function(){       ///  alert(num)       if(num==1){           $(".first2").animate({left:"-900px"},500,function () {               num++;               $(".first2").css("left","900px");           });           $(".second2").animate({left:"0px"},500,function () {

// $(".first2").css("marginLeft","900px");           });       } if(num==2){

$(".second2").animate({left:"-900px"},500,function () {               num=1               $(".second2").css("left","900px");           });           $(".first2").animate({left:"0px"},500,function () {

});       }

});