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

How do I make a slideshow button in javascript?

本文关键字：幻灯片 按钮 javascript      更新时间：2023-09-26

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

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);
    }

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

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

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

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

然后，您可以在到达末尾时调用 clearInterval。

你需要在函数之外声明你的 setInterval，这样你就可以在最后清除。

相关文章：