一组带有幻灯片的图像 - javascript答案

【问题标题】：a set of images with a slide show - javascript一组带有幻灯片的图像 - javascript
【发布时间】：2017-12-26 22:30:53
【问题描述】：

我想为网站上的多张图片制作幻灯片放映，但在尝试复制脚本或以不同名称创建新函数以点亮页面上的下一张图片时遇到问题。然后你不能在页面上看到两张照片，或者你只能看到一张。我是 JS 新手，我只想在我下面做一些图片，以便每张图片每 2 秒更改一次，我需要它来做一个网站。

问候

这里是原始代码： https://jsfiddle.net/bradtraversy/74owmd01/

我的问题 JS：

var i = 0;          // Start Point
var images = [];    // Images Array
var time = 3000;    // Time Between Switch

// Image List
images[0] = "http://lorempixel.com/400/200/animals";
images[1] = "http://lorempixel.com/400/200/sports";
images[2] = "http://lorempixel.com/400/200/food";
images[3] = "http://lorempixel.com/400/200/people";

// Change Image
function changeImg(){
    document.slide_1.src = images[i];

    // Check If Index Is Under Max
    if(i < images.length - 1){
      // Add 1 to Index
      i++; 
    } else { 
        // Reset Back To O
        i = 0;
    }

  function changeImg_2(){
    document.slide_2.src = images[i];

    // Check If Index Is Under Max
    if(i < images.length - 1){
      // Add 1 to Index
      i++; 
    } else { 
        // Reset Back To O
        i = 0;
    }


    // Run function every x seconds
    setTimeout("changeImg()", time);
  setTimeout("changeImg_2()", time);
}

// Run function when page loads
window.onload=changeImg;

HTML：

<img name="slide_1" width="400" height="200" />
<img name="slide_2" width="400" height="200" />

【问题讨论】：

有什么问题？你有错误信息吗？

标签： javascript html css image web

【解决方案1】：

请更新您的代码。

var i = 0;          // Start Point
var images = [];    // Images Array
var time = 5000;    // Time Between Switch

// Image List
images[0] = "http://lorempixel.com/400/200/animals";
images[1] = "http://lorempixel.com/400/200/sports";
images[2] = "http://lorempixel.com/400/200/food";
images[3] = "http://lorempixel.com/400/200/people";

// Change Image
function changeImg(){
document.slide.src = images[i];
  i++;
  if(i>=images.length)
    i=0;

}
$(document).ready(function(){
setInterval(changeImg, time);
});

【讨论】：