I am a beginner in javascript. I am trying to achieve image slider, purely using javascript. For this I am using,
setTimeout(function(){
animateSlider();
}, 5000);
Where animateSlider() is a function responsible for sliding animation. When I tried it on on chrome on my laptop, I figured out that, if I minimize the browser or change the tab, all these calls done using SetTimeout() are stacked, and executes instantly when I reopen the browser tab. This makes all the pending sliding, happen together. To avoid this I used
window.onblur = function() {wblur = true;}
window.onfocus = function() {wblur = false;}
document.onblur = window.onblur;
document.onfocus = window.onfocus;
And used the wblur flag to decide the sliding. This works perfectly on chrome and firefox on laptop, but does not work on chrome and android(Lollipop) browser on mobile. onblur and onfocus events are not getting fired in mobile. So, is there anything else that needs to be done for Android mobile device ? Is there any other method to check if a tab is inactive, on mobile device ?