7
Mam problem z implementacją setInterval. Stworzyłem suwak, w którym setInterval przetwarza funkcję co kilka sekund. Zauważyłem, że po kilku minutach i kilku rundach wykonania setInterval powstaje dodatkowe opóźnienie. Proszę zasugerować, co wydaje się być tutaj problemem?SetInterval tworzy opóźnienie po wielu rundach wykonania
$(document).ready(function() {
var totalItems = $('.sliderItem', '#slider').length;
var currentIndex = $('.itemActive').index() + 1;
var slideTime = 3000;
function goNext (e) {
$('.sliderItem').eq(e).fadeOut(500);
$('.welcomeBox > .welcomeText1', '.sliderItem').eq(e).hide(500);
$('h1', '.sliderItem').eq(e).hide(500);
$('h2', '.sliderItem').eq(e).hide(500);
if(e == totalItems - 1) {
e = 0;
} else {
e++;
};
$('.sliderItem').eq(e).fadeIn(400);
$('h1', '.sliderItem').eq(e).delay(800).show(400);
$('h2', '.sliderItem').eq(e).delay(500).show(400);
$('.welcomeBox > .welcomeText1', '.sliderItem').eq(e).delay(300).show(400);
currentIndex = e;
};
function loader() {
$('.loader').animate({"width":"100%"}, slideTime - 199);
$('.loader').animate({"opacity":"0"}, 199);
$('.loader').animate({"width":"0%"}, 0);
$('.loader').animate({"opacity":"1"}, 0);
};
function autoPlay (e){
timer = setInterval(function() {
loader();
goNext(e - 1);
console.log(e);
if(e == totalItems) {
e = 1;
} else {
e++;
};
currentIndex = e;
}, slideTime);
};
autoPlay(currentIndex);
});
https://codepen.io/Sizoom/pen/ayjNog
Mówisz o "dodatkowym opóźnieniu". Czy masz na myśli, że nagle ma dłuższe opóźnienie interwałowe? Czy masz na myśli to, że stopniowo zwiększa się z czasem, więc po kilku minutach nie jest już "zsynchronizowany"? –
Widziałem twoje demo, jeśli problem polega na tym, że pasek wskaźnika nie jest zsynchronizowany z suwakiem, to jest normalne ... powinieneś kierować suwakiem ze zdarzeniem na końcu paska wskaźników .... coś w tym rodzaju – sabotero