Q: setInterval function trying to catch up when switching to another window I have a code that cycle through 2 images.
fading out the first, changing image and then fading in the seconds image.
i'm repeating the process with setInterval function.
when i'm watching the cycles, it looks fine.
when i switch to another tab and return after 10 or 20 seconds, it's like trying to quickly catch up all the fadings and changes i missed ... (going crazy, in short)
here is the setInterval function:
setInterval(function(){
fadeout(PointerToImage, function() {
ChangeImage(function() {fadein(PointerToImage);   } )

});

},5000);

if needed:
Fadeout function:
function fadeout(element,complete) { 
    var op = 1;  // initial opacity
    var timer = setInterval(function () {  //call the function every 50 milliseconds
        if (op <= 0.1){   // stop the function when the op is lower then x and then make in invisible.
                clearInterval(timer); // clear the timer ....
                     if ( typeof complete === 'function' ) // run  it only if complete is a function .....
            {
                complete();
            }

                return true;
        }
        element.style.opacity = op;  // for newer browsers
        op -= op * 0.01;  // reduce 10% each time
    }, 0.05);  // run every 50 seconds
    }

fadein function:
function fadein (element,complete) {   
    var op = 0.1  // initial opacity
    var timer = setInterval(function () {  //call the function every x milliseconds 
        if (op >= 0.99){   // stop the function when the op is higher then x ....
        element.style.opacity  = 1;
        clearInterval(timer); // clear the timer ....
                    if ( typeof complete === 'function' ) // run  it only if complete is a function .....
            {
                complete();
            }

        return true;


        }
        element.style.opacity = op;  // for newer browsers
        op += 0.01;  // reduce 10%
    }, 30);  // run every 50 seconds

    }

ChangeImage function:
 function ChangeImage (complete)  {

liran0.src=imagesarrays[indexid1];
 indexid1=indexid1 +1;


if(indexid1 >= imagesarrays.length){
        indexid1 = 0;
}

