0

あなたはいつも大きな助けをしてくれたので、この問題を問題なく解決できることは間違いありません！

基本的に、私が持っているのは、3つのdiv、＃Item1、＃Item2、＃Item3を切り替えるカルーセルです。3つのボタン（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;」が必要な場合があります。等？

一時停止するには、スライダーのマウスのEnter / LeaveイベントをclearInterval（timer）にバインドしてみてください。そしてそれを再作成します。

于 2013-01-15T13:36:52.123 に答える