Question

我试图弄清楚如何创建以前的图像＆＃39;我的javascript幻灯片按钮。这是我到目前为止的代码..

<img id="slide" height="300" width="300" src="images/1.jpg">
<br />
<button id="previous">Previous Slide</button>
<button id="next" >Next Slide</button>

var i = 1;
var images = [];

images[0] = "images/1.jpg";
images[1] = "images/2.jpg";
images[2] = "images/3.jpg";

var nextImage = function () {
    document.getElementById("slide").src = images[i];   

    if (i < images.length -  1) {
        i++;    
    }
    else {
        i=0;    
    }
}

var previousImage = function () {
    document.getElementById("slide").src = images[i];
}


document.getElementById("next").addEventListener("click", nextImage);
document.getElementById("previous").addEventListener("click", previousImage);

正如您所看到的，我对如何处理我的previousImage函数毫无头绪。有什么想法吗？

Answer 1

试试这个：

var i = 0;
var images = [];

images[0] = "images/1.jpg";
images[1] = "images/2.jpg";
images[2] = "images/3.jpg";

var nextImage = function () {

    if (i < images.length) {
            i++;      
    }
    else {
        i=0;    
    }
    document.getElementById("slide").src = images[i];   

}

var previousImage = function () {
    if (i > 0)
      i--;      
    }
    else {
        i=images.length-1;
    }
    document.getElementById("slide").src = images[i];
}

带按钮的Javascript幻灯片

1 个答案: