Проблема с window.scrollBy в IOS браузерах - PullRequest
1 голос
/ 16 января 2020

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

Функция вызывается с количеством прокручиваемых пикселей, которое затем делится на 30 шагов, а затем прокручивается в al oop, пока число не будет достигнуто. , Таким образом, я попробовал оба варианта зацикливания с setTimeout и requestAnimationFrame.

Он работает почти идеально во всех браузерах настольных компьютеров, а также на моем телефоне android, однако Safari и Chrome на устройствах IOS не могли добраться до желаемая точка. Тестирование с предупреждением в каждой итерации показало, что все значения рассчитаны правильно, однако фактическая сумма прокрутки не совпадает, что приводит к остановке прокрутки в неправильной позиции.

Я не могу предоставить демо-версию, поскольку это коммерческое приложение в разработке, также я попытался сделать упрощенный jsfiddle make , но на самом деле это не показывает ошибку, поэтому это должна быть комбинация с чем-то еще, что вызывает проблему (вероятно, css фиксированная позиция, минимальная высота 100vh, обработчики событий прокрутки ...?).

Я определенно думаю, что это странное поведение и должно было быть замечено другими ранее. Кто-нибудь может дать мне подсказку, что делать?

function scrollstep(dist) {
    var n = Math.floor(dist / 30 * (1 - Math.abs(scrstp_dist / dist - 0.5)));
    if (Math.abs(scrstp_dist + n) < Math.abs(dist)) {
        scrstp_dist+=   n;
    // alert(n);
        w.scrollBy(0, n);
        w.requestAnimationFrame( function(timestamp) { scrollstep(dist); } );
    } else {
        w.scrollBy(0, dist - scrstp_dist);
    }
}
...