Помогите пожалуйста разобраться со скриптом
Здравствуйте, у меня возникла небольшая проблема со слайдером, к сожалению я плохо разбираюсь в javascript/jQuery, приходится изучать так сказать "на ходу".
Суть проблемы: в шапке сайта есть слайдер, который "перелистывает" изображения через определенный промежуток времени (интервал, заданный в функции), все бы нечего, но в браузерах Chrome/Safari при переходе на другие вкладки, и последующем возврате на вкладку с сайтом, слайдер начинает крутиться с таймаутом в 1 секунду. Пока не наверстает упущенные прокручивания. Я попыталась исправить баг, заменив функцию setInterval на setTimeout, но к сожалению проблема осталась, помогите пожалуйста решить данную проблему Код с функцией setInterval: jQuery(document).ready(function(){ function htmSlider(){ var slideWrap = jQuery('.b-slider-image'); var slideWidth = jQuery('.b-slide-item').outerWidth(); var scrollSlider = slideWrap.position().left - slideWidth; timer = setInterval(function(){ slideWrap.animate({left: scrollSlider}, 1000, function(){ slideWrap .find('.b-slide-item:first') .appendTo(slideWrap) .parent() .css({'left': 0}); }); }, 5000); } htmSlider(); }); Код с функцией setTimeout: jQuery(document).ready(function(){ function htmSlider(){ var slideWrap = jQuery('.b-slider-image'); var slideWidth = jQuery('.b-slide-item').outerWidth(); var scrollSlider = slideWrap.position().left - slideWidth; timer = setTimeout(function run(){ slideWrap.animate({left: scrollSlider}, 1000, function(){ slideWrap .find('.b-slide-item:first') .appendTo(slideWrap) .parent() .css({'left': 0}); }); timer = setTimeout(run, 5000); }, 5000); } htmSlider(); }); |
Shalty,
смотрите метод clearInterval(TimerID) |
Часовой пояс GMT +3, время: 14:39. |