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

时间:2013-10-31 08:42:41

标签: javascript slideshow

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

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

2 个答案:

答案 0 :(得分:0)

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

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

答案 1 :(得分:0)

使用window.setInterval调用下一个方法。使用此功能,您可以每隔5秒钟继续拨打下一个电话。

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

然后,当你到达终点时,你可以调用clearInterval。

您需要在函数外声明setInterval,以便在最后清除它。