Le_Traceur_Snork
@Le_Traceur_Snork
PHP-программист

Как изменить ширину блока через jQuery в фоновой вкладке?

Добрый день. Делаю самопальный progress-bar на основе bootstrap-овского
Код:
var bar = form.find(".edit-toggle-block .progress .progress-bar");
var steps = 2 * {$block_info -> default_block_time} - 1;  // how many steps of that func we can make during edit period (2 - because we make 2 steps per sec; -1 because we can't make 1st move)  
var width_delta = 100 / steps; // delta percent that we can jump for
progressInterval = setInterval(function(){
    var width = bar.width() / bar.parent().width() * 100;                             
    bar.css("width", width+width_delta+"%");
}, 500);

Вставки через {} - это Smarty
Этот же таймер используется ещё в одном месте, вызывает некую функцию №2 с визуальными изменениями

Разница в поведении:
  • Если ждать исполнения скрипта, находясь на вкладке, progress-bar доходит до 100% и вызывается функция №2, визуально подтверждено
  • Если вызвать скрипт, сменить вкладку браузера, посидеть там некоторое время, и успеть вернуться до окончания его работы, progress-bar как будто сдвинулся, даже до сих пор двигается, но функция №2 вызывается далеко не на 100% - зависит от времени нахождения на других вкладках, чем дольше - тем больше рассинхрон функции и прогресс-бара

Засекал с секундомером, функция №2 всегда вызывается точно по времени, а вот прогресс-бар постоянно ведёт себя по-разному, неправильно складывает дельту, если вкладка фоновая

Вопрос, как заставить его нормально отрабатывать в фоне?
p.s. Думал, что это зависит от CSS-свойства transition и его аргумента - зависит только если время transition больше или равно интервала выполнения функции, при меньших значениях отрабатывает нормально (на вкладке, опять же, не в фоне)
p.p.s. Браузер Google Chrome (Версия 88.0.4324.150)
  • Вопрос задан
  • 36 просмотров
Решения вопроса 1
Le_Traceur_Snork
@Le_Traceur_Snork Автор вопроса
PHP-программист
Поверхностно решил проблему:
Оказывается, что при попадании вкладки в фон, все интервалы, у которых длительность меньше 1 секунды, становятся интервалами с длительностью в 1 секунду.
Т.о.: я уменьшил steps (не умножаю его на 2) и увеличил время интервала с 500 до 1000
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы