javascript - 如何在javascript中制作幻灯片按钮？

Question

我试图为图像制作一个灯箱。我有下一个和上一个按钮，它们正在工作。现在我正在尝试使用我现有的代码制作幻灯片按钮...是否可以使用我的代码制作幻灯片播放和暂停按钮...这是我的代码...

var current_index = 0 // Our current index and total_images is the array variable containing images path
    function Next() // Call to go to the next image
    {
        // If we're at the last index, go to zero, else go to the next index
        current_index = (current_index === (total_images.length - 1) ? 0 : current_index + 1);
        UpdateImage(); // Call update
    }

    function Previous() // Call to go to the previous image
    {
        // If we're at the first index (0), go to the last, otherwise go to the previous index
        current_index = (current_index === 0 ? (total_images.length - 1) : current_index - 1);
        UpdateImage(); // Call update
    }

    function UpdateImage() // Call to update the image element
    {
        document.getElementById('imgFull').src = total_images[current_index]; // Self explaining
    }function Play()
    {
        var runSlideShow = setInterval(Next, 3000);
    }
    function Stop()
    {
        window.clearInterval(runSlideShow);
    }

Answer 1

使用 window.setInterval 调用下一个方法。使用它，您可以每隔 5 秒继续呼叫下一个。

var intervalSlide = window.setInterval(Next,5000);
window.clearInterval(intervalSlide);

然后，您可以在到达终点时调用 clearInterval。

您需要在函数之外声明 setInterval ，以便在最后使用 clear 。

Answer 2

您可以使用 setInterval 并调用 Next() 函数并使用 clearInterval 暂停幻灯片。

var runSlideShow = setInterval(Next, 3000);
clearInterval(runSlideShow);