幻灯片放映javascript播放/暂停按钮_Javascript_Html_Slideshow

幻灯片放映javascript播放/暂停按钮

javascript html

幻灯片放映javascript播放/暂停按钮,javascript,html,slideshow,Javascript,Html,Slideshow,我正在用Javascript制作一个带有播放/暂停按钮的幻灯片。当我按下按钮一次时，幻灯片开始播放。当我第二次按下时，幻灯片放映必须停止。我只是不知道如何把这个功能放在一个按钮上这是我的密码： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Oefening 19.7</title> <link href="stij

我正在用Javascript制作一个带有播放/暂停按钮的幻灯片。当我按下按钮一次时，幻灯片开始播放。当我第二次按下时，幻灯片放映必须停止。我只是不知道如何把这个功能放在一个按钮上

这是我的密码：

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>Oefening 19.7</title>
    <link href="stijl_Oefening19_6.css" rel="stylesheet" />
    <script>
    var i = 0;
    var foto = new Array(3);
    var timer;

    foto[0] = "images/slideshow/slideshow1.png";
    foto[1] = "images/slideshow/slideshow2.png";
    foto[2] = "images/slideshow/slideshow3.png";
    foto[3] = "images/slideshow/slideshow4.png";

    function slide() {

            document.getElementById("slideshow").src = foto[i];

            if (i < foto.length - 1) i++;
            else i = 0;

            timer = setTimeout("slide()", 3000);
    }
    </script>
</head>

<body>
    <div id="portfolio">
        <img src="images/slideshow/slideshow1.png" id="slideshow" alt="slideshow" />
    </div>
    <div id="button">
        <a href="#" id="startcycle" onclick="slide()">
            <img id="btnCycle" src="images/slideshow/cyclebutton.png" />
        </a>
    </div>
</body>

</html>


Oefening 19.7
var i=0；
var foto=新数组（3）；
无功定时器；
foto[0]=“images/slideshow/slideshow1.png”；
foto[1]=“images/slideshow/slideshow2.png”；
foto[2]=“images/slideshow/slideshow3.png”；
foto[3]=“images/slideshow/slideshow4.png”；
函数幻灯片（）{
document.getElementById（“幻灯片”）.src=foto[i]；
if（i

改用setInterval（）。并分离开关功能和滑动功能
function slide() {
    document.getElementById("slideshow").src = foto[i];
    i = (i + 1)%foto.length;
}
function setTimer(){
    if (timer) {
       // stop 
       clearInterval( timer );
       timer=null;
    }
    else {
       timer = setInterval("slide()",1000);
    }
}

让按钮调用setTimer（）。
你不应该自己做作业吗？顺便说一下，您的slide（）函数中似乎缺少一个}
。foto
是一个包含4个元素的数组。构造函数获取要创建的元素数，而不是最高元素的索引。-此外，您还可以轻松实现一个标志。在按钮按下处理程序中，只需在true和false之间切换。如果标志为false，则不要更改图像。否则，照常进行。与论坛网站不同，我们不使用“谢谢”或“感谢任何帮助”或签名。请看“.回答不错.只需更改”clearTimeout（计时器）；“至”清除间隔（计时器）；“这将是完美的。哦，打字错误。感谢调试。