Home/ Questions/Q 7807133
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-02T02:45:26+00:00

Basically, what I’m trying to do is shuffle through images using some JavaScript code.

  • 0

Basically, what I’m trying to do is shuffle through images using some JavaScript code. All it does is change the display style of the current image to block, and at the same time change the previous one to none.

The HTML code:

<body>
<img src="http://bit.ly/yOqqbg" id="image1" style="display: block;">
<img src="http://bit.ly/dezBUZ" id="image2" style="display: none;">
<img src="http://bit.ly/IvM5HE" id="image3" style="display: none;">
</body>​

The JavaScript code:

var id = ["image1", "image2", "image3"]; //Array with the id's in the document you want        
to shuffle through
var i = 0; //Set inital array element
initiateTimer(); //Get the loop going

function initiateTimer() {       
if (i > id.length) {
    i = 0;
    initiateTimer();
}
setTimeout(function() { changeElement(); }, 2000); //2000 = 2 seconds
}

function changeElement() {  
if (id === 0) {
    document.getElementById(id[2]).style.display = 'none';
    document.getElementById(id[i]).style.display = 'block';
} else {
    document.getElementById(id[i - 1]).style.display = 'none';
    document.getElementById(id[i]).style.display = 'block';
}
i += 1;
initiateTimer();
} ​
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    when i === 3 you will have problems

    if (i > id.length) {

    should become

    if (i >= id.length) {

    UPDATE: http://jsfiddle.net/HgNuc/

    • 0