Wie setze ich einen Timer auf x Anzahl der Bilder (JavaScript)

Question

Ich habe einen Code, der das Bild ändert, das jedes Mal angezeigt wird, wenn auf eine Schaltfläche geklickt wird. Allerdings benötige ich den Code um die Bilder auf einen Timer zu stellen, so dass die Taste nur einmal angeklickt werden muss und die Bilder in gleichen Zeitabständen dazwischen angezeigt werden.

Ich habe versucht, einige Timer auf JavaScript zu recherchieren, aber ich kann nicht scheinen, eine Antwort zu finden.

Vielen Dank im Voraus.

Answer 1

Beispiel Kommentar (Sie werden es sehen flackern, da keine tatsächliche Bild Urls), wenn Sie nett wollen Verblassen in und aus Bildern würde ich jQuery.fadeTo

function rotateImages() { 
 
    var images = ['image1.jpg', 'image2.jpg']; 
 
    var imageEle = document.getElementById('image_id'); 
 
    var imageInterval = setInterval(swapImage, 2000); 
 
    var i = 0; 
 
    function swapImage(){ 
 
    if(i === images.length - 1){ 
 
     clearInterval(imageInterval); 
 
    } 
 
    imageEle.src = images[i]; 
 
    i++; 
 
    }  
 
}

<img id="image_id" src="image.jpg"> 
 
<button onclick='rotateImages();'>Rotate Images</button>

zu überprüfen, empfehlen