Пустое пространство сверху и снизу при прокрутке на мобильном телефоне

Question

Я создаю новый веб-сайт, на котором я хочу, чтобы моя навигационная панель фиксировалась вверху при прокрутке. Это работает, но на мобильном телефоне есть пробел сверху или снизу, когда мы прокручиваем. Проблема в том, что у меня есть навигация с левой стороны на мобильном телефоне. Эта навигация не перемещается, когда я прокручиваю, верхняя панель навигации не проходит под левой панелью навигации, и это действительно ужасно.

Вот мой сайт, если вы не понимаете https://www.hytalefrance.net

Я пробовал что-то вроде этого:

overscroll-behavior: none;

Но это ничего не меняет

body {
  height: 100%;
  overflow: auto;
}

Ничего не делать

Это классическая навигационная панель начальной загрузки 4, но я не использую класс с фиксированной вершиной, чтобы исправить ее, это пользовательский класс, похожий на фиксированный-верх

.sticky.is-sticky {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1000;

}

Я бы хотел, чтобы пробелы на мобильном телефоне исчезли.

Снимок экрана, сделанный на моем мобильном телефоне (iPhone 6)

Я прокручиваю вниз:

Когда открыта навигация:

Когда я прокручиваю с открытой навигацией:

Answer 1

Я исправил проблему, удалив мою функцию js.На рабочем столе навигационная панель не будет исправлена, на мобильном телефоне навигационная панель теперь непосредственно исправлена, и она работает

Answer 2

Я полагаю, вы испытываете инерционное поведение прокрутки, вызванное чрезмерной прокруткой веб-страницы в iPhone. Для этой проблемы нет идеального решения.

Существует несколько частичных решений, которые могут / не могут работать в вашем случае
- Как отключить инерционную прокрутку на теле для браузеров iOS?
- ipad Safari: отключить прокрутку и эффект отказов?

Хотя, это не рекомендуется, чтобы предотвратить это. Это перехватит естественную плавность прокрутки в браузере.

Я бы посоветовал вам установить цвет фона вашего тела на точный bg цвет вашей навигационной панели, чтобы сделать его менее очевидным