スライドショーを使用した一連の画像 - javascript

Question

スクリプトをコピーしたり別の名前で新しい機能を作成しようとすると問題が発生したときに、ウェブサイト上の複数の画像のスライドショーを作成したいページ上の次の画像。それで、あなたはページ上の両方の写真を見ることができず、1つしか見ることができません。私はJSに新しいです、私はちょうど私の下にいくつかの写真をしたいので、すべての画像が2秒ごとに別のものに変わるように、私はウェブサイトのためにそれが必要です。

よろしくここ

のorignalコードです： 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" /> 

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