dimanche 16 août 2020

SetInterval "loop" to change array item and reverting previous item change function not working? (noob) Javascript

I'm very new to js and am trying to loop 5 text elements from 40% opacity to 100% one at a time within a time interval. If there's a better way to code this, PLEASE let me know because I've been trying to vary this function for 5 hours... Also any js tips are appreciated. Thx!

var i = 0;  // start point
var j = -1;
var images = [];    // item Array define
var time = 2000;    // time between switch
     
// item array actual

images[0] = document.getElementById("suppDirText");
images[1] = document.getElementById("videoMeetText");
images[2] = document.getElementById("factInspText");
images[3] = document.getElementById("orderSupText");
images[4] = document.getElementById("payProtText");



function changeImg(){
    images[i].style.opacity = "1";
}
function changeImgBack(){
    images[j].style.opacity = "0.4";
}

// change func
function iconFlow(){
    if (j = -1){
        changeImg();
        i++;
        j++;
    } else if (j < images.length - 2){
        changeImg();
        changeImgBack();
        i++;
        j++;
    } else if (j < images.length - 1){
        changeImg();
        changeImgBack();
        j++;
    } else
        i = 0;
        changeImg();
        changeImgBack();
        j = -1;
    
    // run function every x seconds
    setInterval("iconFlow()", time);
    console.log(i, j);
}

// run function when page loads
window.onload=iconFlow;

Aucun commentaire:

Enregistrer un commentaire