jquery - Jquery ギャラリーの setTimeout が機能しない

Question

setTimeout で正しく動作しないギャラリーがあります。ギャラリーで数秒ごとに写真を変更する必要があります。しかし、インジケーターを押すと、手動で変更したいと思います。

これは私のjsファイルです:

var arrayPic = ["/img/gallery/gal1.jpg", 
                "/img/gallery/gal2.jpg", 
                "/img/gallery/gal3.jpg", 
                "/img/gallery/gal4.jpg", 
                "/img/gallery/gal5.jpg", 
                "/img/gallery/gal6.jpg"];
var counter = 0;
var waitTime = 5000;
var transitionTime = 500;
var t;
var time_is_on = 0;

$(document).ready(function () {


    t = setTimeout(function() {

        changeThisPhoto();
        changeIndicator();

    }, 1000);

    $(".countrydd").ykDropdown();
    $(".subjectdd").ykDropdown();

});


function stopTime() {

    clearTimeout(t);
    time_is_on = 0;
}


function changeDefaultIndicator() {

    console.log($("li.active"));
    var thisChild = ($("li.active").index(this)) + 1;

    for (var i = 0; i < arrayPic.length; i++) {
        $("#indi" + i).removeClass();
    }

    $("#indi" + thisChild).addClass("active");



}

function changeIndicator() {

    $(".indicatorslist li").bind("click", function () {

        var thisChild = ($(".indicatorslist li").index(this)) + 1;

        for (var i = 0; i < arrayPic.length; i++) {
            $("#indi" + i).removeClass();
        }

        $("#indi" + thisChild).addClass("active");

        changeThisPhoto(thisChild);

    })

 }


function animatePhotoOut() {

    $(".backgroundImage").animate({

        opacity: 1

    }, transitionTime, function () {
        $(".backgroundImage").delay(waitTime);
        changeThisPhoto();

    })

}

function changeThisPhoto(child) {

    var stepper = 0;

    if (!child) {
        child = -1;
    }


    $(".backgroundImage").stop().animate({
        opacity: 0
    }, transitionTime, function () {


        if (counter == 5) {
            counter = 0;
        } else {
            counter++;
        }

        if (child = -1) {
            stepper = counter;
        }
        else {
            stepper = child;
        }

        $(".backgroundImage").css("background-image", 
                                  "url('" + arrayPic[stepper] + "')");

        changeDefaultIndicator();
        animatePhotoOut();
    })
}

インジケーターをクリックすると美しく動作しますが、setTimeout() 関数では動作しません...おそらく...

Answer 1

はsetTimeout変更を 1 回だけ実行します。setInterval代わりに使用してください。