个回答

• 糖糖涛涛

  2016-11-28 11:08:12

  已采纳

  var count;
  $(document).ready(function(){
    count= $(".main a").length; /*给动态变化的i备用*/;
    //创建一个showTime函数
  function showTime(){
    //定时器
    timer = setInterval(function(){
      //调用一个Show()函数
      Show();
      i++;
      //当图片是最后一张的后面时，设置图片为第一张
      if(i==5){
        i=0;
      }
    },2000);
  }
  
  
  //创建一个Show函数
  function Show(){
    //在这里可以用其他jquery的动画
    $('.ig').eq(i).fadeIn(300).siblings('.ig').fadeOut(300);
    
    //给.tab创建一个新的Class为其添加一个新的样式，并且要在css代码中设置该样式
    $('.tab').eq(i).addClass('bg').siblings('.tab').removeClass('bg');
    
    /*
     * css中添加的代码：
     * .bg{ background-color: #f00; }
     * */
  }
    
    //鼠标点击左侧的箭头
    $('.btn1').click(function(){
      clearInterval(timer);
      if(i == 0){
        i = count;//注意此时i的值
      }
      i--;
      Show();
      showTime();
    });
    
    //鼠标点击右侧的箭头
    $('.btn2').click(function(){
      clearInterval(timer);
      //console.log(count-1);
      if(i == count-1){
        i = -1;//注意此时i的值
      }
      i++;
      Show();
      showTime();
    });
    
  });

  
  

  0