Mobile - overflow-y: hidden не останавливает прокрутку элемента body

Question

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

Я не приму следующие, поскольку они не работают полностью (проверено):

Добавление следующего к тегам body и html

Это работает, но заставляет страницу прыгать наверх. Вы можете разбить его в Safari, если вы перевернете альбомную ориентацию и получите панель инструментов браузера, чтобы показываться при прокрутке

.noScroll { 
    height: 100%;
    overflow-y: hidden;
}

Добавление следующего к тегу body

Это работает, но заставляет страницу прыгать наверх.

.noScroll { 
    height: 100%;
    overflow-y: hidden;
    position: fixed;
}

Сочетание JS и CSS

Вы можете разбить его в Safari, если перевернуть альбомную ориентацию и заставить панель инструментов браузера отображаться при прокрутке Этот метод решает проблему скачка

.noScroll { 
    height: 100%;
    overflow-y: hidden;
    position: fixed;
}

var body = document.body,
    lastTop = 0,
    startScroll,
    stopScroll;

startScroll = function () {
    body.style.top = '';
    body.scrollTop = lastTop; 
};

stopScroll = function () {
    lastTop = document.body.scrollTop;
    body.className = 'noScroll';
    body.style.top = '-' + lastTop.toString() + 'px';
}

Я пробовал другие методы, но они тоже не работают. Вы можете отключить сенсорное перемещение на теге body, но оно не позволяет вам прокручивать где-либо, например

document.body.addEventListener('touchmove', function () { return false; });

Есть ли что-нибудь, что я могу сделать.

Полоса прокрутки JS - единственное правильное решение на данный момент.

ура