Я создаю приложение 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);
Кто-нибудь знает, в чем может быть проблема?