У setTimeout () есть проблемы, когда это окно не сфокусировано? - PullRequest
Новая
       1

У setTimeout () есть проблемы, когда это окно не сфокусировано?

3 голосов
/ 06 октября 2011

Я работаю над сайтом, который использует setTimeout () для создания своего рода «слайд-шоу» с баннерами на моем сайте. Все отлично работает, у меня задержка установлена ​​на 10 секунд. Проблема возникает только когда я переключаю окна / вкладки и делаю что-то еще. Когда я возвращаюсь, функция запускается кучу раз, которые я (предполагаю) догоняю или что-то в этом роде. Проблема в том, что мой экран начинает мерцать снова и снова, показывая все исчезающие и исчезающие баннеры.

Есть идеи по решению? Я заметил это в Google Chrome, я также знаю, что это происходит в Firefox. Не уверен насчет IE.

EDIT

Вот фрагмент, с которым я имею дело. К сожалению, он является частью очень большого скрипта и связан с очень сложным HTML-файлом.

Надеюсь, вы сможете хотя бы понять, что здесь происходит: 

var lval=0;
var nval=1;
setHead = function(data) {
        lval=nval;
        var index=1;
        $.each(data, function(name,value) {
            if (Math.floor(Math.random()*index+2)==index+1) {
                nval=index;
            }
            if (index==lval) {
                $('.headmaster').find('img').fadeOut('fast');
                //$('.headmaster').css('background-color',value.backgroundcolor);
                $('.headmaster').find('a').attr('href',value.url);
                $('.headmaster').animate({backgroundColor:value.backgroundcolor},'slow',function() {
                    $('.headmaster').find('img').attr('src',value.img);     
                    $('.headmaster').find('img').fadeIn('slow');                                                                        
                });
            }
            index++;
        });
        setTimeout(function() { setHead(data); },10000);
}

arrayGet = function(arr,idx) {
    $.each(arr, function(i,v) {
        if (i==idx) {
            return v    
        }
    });
    return null
}

$(document).ready(function() {  
    $.getJSON('json/intros.json', setHead);
});

Я использую jQuery для анимации и плагин цвета для выцветания цветов.

1 Ответ

3 голосов
/ 08 октября 2011

Это происходит, вероятно, потому что вы используете старую версию jQuery.А именно тот, где команда разработчиков начала использовать requestAnimationFrame API.К счастью, они исправили это в 1.6.3.Вот выдержка из их блога :

Больше нет анимационных «червоточин»: Мы возлагали большие надежды на API браузера requestAnimationFrame, когда мыдобавлена ​​поддержка в версию 1.6.Однако одна из самых больших жалоб, которые мы получили с тех пор, связана с тем, как requestAnimationFrame действует, когда вкладка не видна.Все анимации запускаются, когда вкладка является невидимым «стеком» и не выполняется, пока вкладка не вернется в фокус.Тогда они все оживляют со скоростью деформации!Мы удалили поддержку этого API (которая никак не влияет на то, как вы называете функции анимации jQuery) и планируем включить его в будущую версию jQuery.

Просто обновите до 1.60,4 .

...