На сайте есть КНОПКА, прижатая к низу окна браузера: display:fixed, bottom:10px;
В мобильном браузере (в данном случае CHROME) есть
верхняя шторка, куда вводится URL, которая исчезает при скроле, увеличивая высоту области сайта (100vh). Кнопка остается внизу, всё как и положено.
ОДНАКО, если скролить так, чтобы шторка исчезла и страница продолжила ползти
по инерции вниз, при этом резко её остановить касанием экрана, то
область нажатия нижней КНОПКИ сползает по направлению скрола на сантиметр (на высоту исчезнувшей шторки), хотя сама кнопка остается отрисованной в нужном месте. Баг пропадает, если хоть на 1 px подвинуть страницу (скрол)
Пример кода для теста в мобильном браузере, типа CHROME (не в пк)
https://jsfiddle.net/8ofyqh52/1/
Как эту фигню побороть? Сайт с нижней навигацией по типу приложения становится крайне неудобен пользователю
из-за этого бага, т.к. кнопки то работают, то не работают, в зависимости от манеры скрола пользователя: если он скролит перетаскиванием страницы - то всё ок. А если он как бы швыряет страницу скроля по энерции, то пока страница не остановится нижняя навигация не работает.
Простой
Средний
