Question

如何让它自动滑动？我已经做了，所以你可以手动滑动它们，但我希望它们同时移动。

var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
    showSlides(slideIndex += n);
}

function currentSlide(n) {
    showSlides(slideIndex = n);
}

function showSlides(n) {
    var i;
    var slides = document.getElementsByClassName("mySlides");

    if (n > slides.length) {
        slideIndex = 1
    }
    if (n < 1) {
        slideIndex = slides.length
    }
    for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";
    }
    slides[slideIndex - 1].style.display = "block";
    dots[slideIndex - 1].className += " active";
}
};

Answer 1

您可以使用以下代码使其正常工作。

var slideIndex = 1;
    $(function () {
        automaticSlider();
    })

    function automaticSlider() {
        showSlides(slideIndex);
        setInterval(function () { automaticSlider(); }, 1000) // 1000 is 1 sec before calling next slide.
    }

function plusSlides(n) {
    showSlides(slideIndex += n);
}

function currentSlide(n) {
    showSlides(slideIndex = n);
}

function showSlides(n) {
    var i;
    var slides = document.getElementsByClassName("mySlides");

    if (n > slides.length) {
        slideIndex = 1
    }
    if (n < 1) {
        slideIndex = slides.length
    }
    for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";
    }
    slides[slideIndex - 1].style.display = "block";
    dots[slideIndex - 1].className += " active";
}
};

在加载时调用函数automaticSlider（），然后设置interval，在1秒后调用automaticSlider（）函数。你可以根据自己的说服时间增加时间。

如何将JS添加到此代码中以便自动滑动？

1 个答案: