Только setTimeout выполняет функцию. JS

Я пытаюсь внедрить плеер на свой сайт. Если нажать кнопку 'Play', запускается музыка и страница плавно прокручивается вниз. Но когда вы нажимаете кнопку 'Mute' (function(){music.volume=0}), я не уверен, почему страница снова появляется вверху. window.scroll() ничего не делает без промедления. Поэтому я использую функцию setTimeout для прокрутки страницы в текущем месте. Проблема в том, что в Opera и IE setTimeout занимает около 10 ms, поэтому, когда я нажимаю кнопку 'Mute', я вижу галочки вверх и вниз. В хроме занимает только 2 ms и проблем нет. Теперь, когда я решил создать свою собственную функцию тайм-аута, window.scroll() снова не работает.

Вот мой код:

var isMuted = false;
muteButton.onclick = function() {   ////This function works with big delay.
    if (!isMuted) {
        mainAudio.volume = 0;
        isMuted = true;
    } else {
        mainAudio.volume = bgAudioTrackVolume;
        isMuted = false;
    }
    setTimeout(function() {
        window.scroll(0, offset); /// Works
    }, 0)
};

Измените setTimeout с помощью:

i = 9542155.873; /// I have tried delay time from 1ms - 250ms by changing this value.
while (i > 0.00001) {
    i = i / 1.0001234567;
    if (i < 0.00001) {
        window.scroll(0, offset); /// Does not do anything. Strange! Have tried to change variable with a number.
    }
}

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


javascript settimeout
person user2998173    schedule 22.11.2013    source источник
comment
Это потому, что ваш цикл while блокируется, а setTimeout неблокирует, поэтому что-то в вашем скрипте что-то меняет, и использование setTimeout задерживает выполнение до тех пор, пока эти изменения не будут сделаны, поскольку скрипт продолжает выполняться и просто ставит функцию тайм-аута в очередь на потом , в то время как цикл просто блокирует браузер, а нормальная цепочка выполнения все еще работает.   -  person adeneo    schedule 23.11.2013
comment
Каково значение offset и как оно рассчитывается?   -  person jfriend00    schedule 23.11.2013
comment
Дайте угадаю, кнопка отключения звука выглядит как <a href="#"> и вы не отменяете мероприятие?   -  person Dagg Nabbit    schedule 23.11.2013
comment
Является ли muteBUtton ссылкой? С атрибутом href="#"?   -  person Guffa    schedule 23.11.2013
comment
Да это ссылка! Это проблема? Должен ли я изменить его с меткой?   -  person user2998173    schedule 23.11.2013

Ответы (1)


arrow_upward
0
arrow_downward

Причина, по которой страница прокручивается вверх, заключается в том, что вы используете ссылку с пустой закладкой #, которая представляет собой начало страницы. Причина, по которой метод scroll не работает без таймаута, заключается в том, что переход к закладке происходит после обработчика события.

Вместо того, чтобы пытаться прокрутить страницу туда, где она была, просто остановите действие ссылки по умолчанию, вернув false из обработчика событий:

var isMuted = false;
muteButton.onclick = function() {
    if (!isMuted) {
        mainAudio.volume = 0;
        isMuted = true;
    } else {
        mainAudio.volume = bgAudioTrackVolume;
        isMuted = false;
    }
    return false;
};

В качестве альтернативы используйте какой-либо другой элемент, кроме ссылки.

person Guffa    schedule 22.11.2013
comment
Спасибо! Так просто! Это замечательно! - person user2998173; 23.11.2013