requestAnimationFrame: различное поведение между дисплеем сетчатки и вторичным монитором? - PullRequest
0 голосов
/ 27 ноября 2018

Я создаю приложение React и использую requestAnimationFrame, чтобы применить специальный CSS-эффект к некоторым элементам, контролируемым библиотекой parallax (Plx).

Мой эффект должен динамически применяться к событию прокрутки,но eventListener не работал гладко.Когда я реализовал RAF, анимация отлично работала на моем втором мониторе, но ужасно на моем дисплее MacBook (эффект запаздывания).

Тот же браузер, та же вкладка, без обновления.

вот как я запускаю цикл:

setTimeout(function () {

    var raf = window.requestAnimationFrame ||    
        window.webkitRequestAnimationFrame ||
        window.mozRequestAnimationFrame ||
        window.msRequestAnimationFrame ||
        window.oRequestAnimationFrame;

    var $window = $(window);

    var lastScrollTop = $window.scrollTop();

    if (raf) {
        loop();
    }

    function loop() {
        var scrollTop = $window.scrollTop();

        if (TextGalaxy.resetScrollSpeed) {
            return false;
        }

        if (lastScrollTop === scrollTop) {
            raf(loop);
            return false;
        } else {
            lastScrollTop = scrollTop;

            // fire scroll function if scrolls vertically
            TextGalaxy.updateScreenView();
            raf(loop);
        }
    }
}, 20);

Кто-нибудь знает, в чем может быть проблема?

...