0

你一直是一个很大的帮助，所以我毫不怀疑你将能够毫无问题地解决这个问题！

基本上我所拥有的是一个在三个 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;

}); 

});
4

1 回答 1

1

在您的按钮单击事件中，您尝试使用 == 为计数器分配一个值，但这只是进行比较，也许您需要 'counter = 1;' ETC？

要暂停，您可以尝试将滑块上的鼠标进入/离开事件绑定到 clearInterval(timer); 并重新创建它。

于 2013-01-15T13:36:52.123 回答