Menu
I am using setInterval() to call a function that slides an image slider using jQuery’s animate() method. When I go to another tab or another program for a couple seconds/minutes and then get back to my website, the slider slides for all the events that happened in the meantime, one after another with no pause.
Did anybody EVER have this problem anywhere and how can i possibly solve it? I am using the same “way” of building content sliders with jQuery animations for like a 3 or 4 years now, it never happened before, i am trying to compare my code with previous ones and can see no mistake… i thought it might be the return values, so i tried returning both true and false, changes nothing.
The problem occurs in both Firefox and Chrome (IE not tested).
I don’t know if anyone would wanna read the code, it’s kinda long-ish and messy, but knock yourself out if you wanna
[code=html]// increases faderimage counter and calls faderTo()
function fadeHomepageFader() {
if(!(autoFading)) return true;
currentFaderImage++;
if(!(faderImages[currentFaderImage])) currentFaderImage = 0;
faderTo(currentFaderImage);
return true;
}
// fades current image into selected image, updates links
function faderTo(id) {
// temporary
var tempFading = autoFading;
autoFading=false;
// Just in case faderTo was called directly, next auto fader should know
// which image is currently on
currentFaderImage=id;
// Fade image and image info
$(‘#fader>span’).animate({‘bottom’:’-38px’}, 400, function(){
$(‘#fader>img’).fadeOut(600, ‘easeOutExpo’, function(){
$(‘#fader>span’).html(faderInfos[id]).animate({‘bottom’:’0px’}, 700);
$(‘#fader>img’).attr(‘src’, faderImages[id]).fadeIn(700);
});
});
// Update image-links
$(‘#faderPages>a’).each(function(){
if($(this).attr(‘id’)==’fader-link_’+id) {
$(this).addClass(‘current’);
} else {
$(this).removeClass(‘current’);
}
});
// temporary false not needed anymore
autoFading=tempFading;
}
setInterval(“fadeHomepageFader()”, 6000);