Автономный PWA, мертвое пространство после скрытия клавиатуры

Некоторое время я безуспешно пытался найти решение этой проблемы.

Итак, у меня есть PWA, который был добавлен на главный экран.

Пользователь открывает PWA с домашнего экрана и переходит к форме.

У меня проблема - ввод в конце формы.

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

После того, как вы скроете клавиатуру, нажав где-нибудь еще, кроме ввода, пустое пространство останется там, где была клавиатура.

Автономный PWA, мертвое пространство после скрытия клавиатуры

Браузер освобождает пространство только после того, как пользователь прокручивает хоть немного вверх.

Я пробовал много разных способов заставить мертвое пространство исчезнуть:

  • Запуск (с использованием JQuery) разных событий при размытии
  • Пытался прокрутить на один пиксель вверх при размытии (для имитации прокрутки)

Я могу определить, когда пространство потеряно по вертикали с помощью setInterval, но я не могу найти способ сообщить android, чтобы избавиться от мертвого пространства.

Я вижу это на Android 8.1.0 при перемещении между PWA, добавленным на рабочий стол (так полноэкранный), и документом Google, который я редактирую. Щелчок в пустом месте под нижним колонтитулом PWA ничего не делает. Если я перехожу на страницу PWA с вводом текста и нажимаю на ввод, а затем выхожу, экран сбрасывается. Вы нашли программное решение - JavaScript или CSS?

daffinm 15.02.2020 17:14

Не подходящее решение. Я обошел свою проблему, добавив поля внизу последнего ввода (то есть в конце страницы), чтобы клавиатура была первой и не создавала забавного белого пространства.

NotJustin 17.02.2020 14:35
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
2
2
216
0

Другие вопросы по теме