div с фиксированной позицией, кажется, перемещается в неправильное место, когда браузер переходит в полноэкранный режим на мобильном телефоне - PullRequest
1 голос
/ 01 октября 2019

Ответ найден на Проблема высоты окна просмотра, когда браузер переходит в полноэкранный режим НЕ решает эту проблему.

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

step one

, а затем, когда нажимается кнопка «перейти в полноэкранный режим», адресная строка удаляется, и я вижуэто на мгновение,

step two

и тогда div просто остается выше того места, где он должен находиться,

step three

На этом этапе прикосновение к экрану или случайный жест смахивает исправляет положение div. Создается впечатление, что при этом срабатывает какая-то функция REDRAW.

step four

Похоже, что порядок событий в браузере при переключении в полноэкранный режим, это не всегда одно и то же, и когда эта последняя версия REDRAW запаздывает на несколько миллисекунд, возникает эта проблема. Если бы я знал способ заставить браузер перерисовывать все в DOM, возможно, я мог бы это исправить. Есть предложения?

1 Ответ

1 голос
/ 01 октября 2019

В качестве импровизированного решения я попробовал это,

window.addEventListener("resize", myDivShakingFunction);
function myDivShakingFunction()
{
  setTimeout(function()
  { document.getElementById("theIdOfTheDivWithThisProblem").style.bottom = "-1px";  },100);

  // the durations may be adjusted for fine tuning through trial and error if necessary

  setTimeout(function()
  { document.getElementById("theIdOfTheDivWithThisProblem").style.bottom = "0px";  },200);
}

Кажется, это работает! Хотя я не пробовал достаточно много раз, чтобы быть уверенным на 100%. Позже сообщит об этом.

...