在幻灯片中添加下一个和上一个按钮

Add next and prev button in slide show

本文关键字:上一个 按钮 下一个 添加 幻灯片      更新时间:2023-09-26

HTML

<img id="myImg"src="slide/2.jpg" name="img" width="1000" height="250"/>

JS

var image1 = new Image();
image1.src = "slide/23.jpg";
var image2 = new Image();
image2.src = "slide/7.jpg";
var image3 = new Image();
image3.src = "slide/4.jpg";
var image4 = new Image();
image4.src = "slide/5.jpg";
var image5 = new Image();
image5.src = "slide/6.jpg";

var step = 1;
function slideImages() {
    if (!document.images) {
        return
        document.images.img.src = eval("image" + step + ".src");
    }
    if (step < 5) {
        step++;
    } else {
        step = 1;
        setTimeout("slideImages()", 3000);
    }
}
slideImages();

这一行永远不会执行。

setTimeout("slideImages()", 3000);

因为您使用step = 1只调用slideImages函数一次,因此它不会经历else情况。

试试这个。

var image1 = new Image();
image1.src = "slide/23.jpg";
var image2 = new Image();
image2.src = "slide/7.jpg";
var image3 = new Image();
image3.src = "slide/4.jpg";
var image4 = new Image();
image4.src = "slide/5.jpg";
var image5 = new Image();
image5.src = "slide/6.jpg";

var step = 1;
function slideImages() {
    console.log('here' + step);
    if (!document.images) {
        return
    }
    document.images.img.src = eval("image" + step + ".src");
    if (step < 5) {
        step++;
    } else {
        step = 1;
    }
    setTimeout(slideImages, 3000);
}
slideImages();