Jquery 在旋转木马中的三个div之间淡入淡出，可选择“不工作”

你总是帮了大忙，所以我毫不怀疑你能毫无问题地解决这个问题

基本上我得到的是一个旋转木马，它在三个div之间切换，Item1，Item2，Item3。我还有三个按钮btn1，btn2，btn3。这样做的目的是使旋转木马像往常一样滚动，但当你点击一个按钮时，它会跳回到那个位置并从那里继续

目前，旋转木马在点击按钮时会跳回正确的div，但随后会转到它应该所在的位置。我肯定我错过了一些简单的东西

还有，当鼠标放在上面时，有没有一种暂停的方法

我已经整理了以下jQuery，您能告诉我哪里出了问题吗

$(function() {


  $('#Item1').fadeIn(1000);

  var timer = setInterval( whichDiv, 6000);

  var counter = 2;

  function whichDiv() {
    if (counter == 0) { counter++; return; }
    else if (counter == 1){
        $('#Item1').addClass('Maxyactive');
        $('#Item2').removeClass('Maxyactive');
        $('#Item3').removeClass('Maxyactive');      
        $('#Item1').fadeIn(1000);
        $('#Item2').hide();
        $('#Item3').hide();
        counter++;
    }
    else if (counter == 2){
        $('#Item1').removeClass('Maxyactive');
        $('#Item2').addClass('Maxyactive');
        $('#Item3').removeClass('Maxyactive');      
        $('#Item1').hide();
        $('#Item2').fadeIn(1000);
        $('#Item3').hide();   
        counter++;
    }
    else if (counter == 3){
        $('#Item1').removeClass('Maxyactive');
        $('#Item2').removeClass('Maxyactive');
        $('#Item3').addClass('Maxyactive');      
        $('#Item1').hide();
        $('#Item2').hide();
        $('#Item3').fadeIn(1000);      
        counter = 1;
    }



  }





$(".btn1").click(function ShowFirst() {

    $('#Item1').addClass('Maxyactive');
    $('#Item2').removeClass('Maxyactive');
    $('#Item3').removeClass('Maxyactive');      
    $('#Item1').fadeIn(1000);
    $('#Item2').hide();
    $('#Item3').hide();
    counter == 2;
}); 



$(".btn2").click(function ShowSecond() {

    $('#Item1').removeClass('Maxyactive');
    $('#Item2').addClass('Maxyactive');
    $('#Item3').removeClass('Maxyactive');      
    $('#Item1').hide();
    $('#Item2').fadeIn(1000);
    $('#Item3').hide();   
    counter == 3;

}); 



$(".btn3").click(function ShowThird() {

    $('#Item1').removeClass('Maxyactive');
    $('#Item2').removeClass('Maxyactive');
    $('#Item3').addClass('Maxyactive');      
    $('#Item1').hide();
    $('#Item2').hide();
    $('#Item3').fadeIn(1000);   
    counter == 1;

}); 

});

---

在您的按钮单击事件中，您正试图使用==为计数器分配一个值，但这只是进行比较，可能您需要“counter=1；”等等

---

要暂停，可以尝试将滑块上的鼠标进入/离开事件绑定到clearIntervaltimer；然后重新创建它。

你能在JSFIDLE上发布一个例子吗？不幸的是，我无法在工作时访问JSFIDLE，但是如果你用它创建一个html文件，并简单地调用三个div Item1、Item2和Item3，那么它将是同一类型的东西。好的，那就可以了！我一次又一次地错过了这些！哦，天哪！