1

特定の間隔で画像を回転させる簡単なスライドショー スクリプトがあります。スライドショーをナビゲートするための「前へ」と「次へ」のボタンがあります。これらのボタンをクリックすると、clearInterval が呼び出され、新しいタイマーが設定されますが、問題は、clearInterval 関数が機能していないようで、タイマーがスタックすることです。

スクリプトは次のとおりです。

        $(document).ready(function() {
        var currentPosition = 0;
        var slideWidth = 570;
        var slides = $(".slide");
        var slidesNumber = slides.length;
        var slideshowInterval;
        var speed = 5000;

        slideShowInterval = setInterval(changePosition, speed);

        slides.wrapAll('<div id="slides_holder"></div>');

        $("#slides_holder").css("width", slideWidth*slidesNumber);

        $("#left_arrow").click(function() {
            if (currentPosition == 0) {
                currentPosition = slidesNumber-1;
            }
            else {
                currentPosition--;
            }

            clearInterval(slideshowInterval);
            slideShowInterval = setInterval(changePosition, speed);
            moveSlide();
        });

        $("#right_arrow").click(function() {
            if (currentPosition == slidesNumber-1) {
                currentPosition = 0;
            }
            else {
                currentPosition++;
            }

            clearInterval(slideshowInterval);
            slideShowInterval = setInterval(changePosition, speed);
            moveSlide();
        });

        function changePosition() {
            if (currentPosition == slidesNumber-1) {
                currentPosition = 0;
            } else {
                currentPosition++;
            }
            moveSlide();
        }

        function moveSlide() {
            $("#slides_holder").animate({"marginLeft": slideWidth*(-currentPosition)});
        }
    });

誰かが私の間違いを指摘できますか？前もって感謝します！

4

1 に答える 1

6

のスペルミスslideshowInterval。

あなたが使用slideShowIntervalしている場所といくつかの場所でslideshowInterval。どちらかを使用してください。

于 2012-05-16T16:11:26.423 に答える