iOS 7 Chrome – фиксированный позиционный ящик не остается внизу, когда всплывает виртуальная клавиатура

У меня есть нижний ящик, который фиксируется в нижней части. При нажатии, выдвижной ящик будет выдвигаться вверх и показывать больше контента. На iOS 7, когда пользователь вводит тег ввода или тег textarea, появляется виртуальная клавиатура. Однако ящик выдвигается на странице, а не прилипает к основанию, когда появляется клавиатура. Пожалуйста, смотрите на рисунке ниже. введите описание изображения здесь

Я сначала столкнулся с проблемой также и в Safari, но я добавил следующий код, чтобы изменить фиксированную позицию на абсолютную, когда клавиатура открыта:

// Apple.Device detects if it is an apple device if (Modernizr.touch && Apple.Device) { /* cache dom references */ var $body = jQuery('body'); /* bind events */ $(document) .on('focus', 'input, textarea', function(e) { $body.addClass('fixfixed'); }) .on('blur', 'input, textarea', function(e) { $body.removeClass('fixfixed'); }); } 

Код CSS:

 .fixfixed #drawer { bottom: 0; margin-left: auto; margin-right: auto; position: absolute; left: 0; right: 0; } 

Это исправление работает в Safari на iOS 7, но оно не работает в Chrome. Кроме того, есть проводящее поведение:

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

Как я могу решить эту проблему? (Я искал какое-то время, но как мне отлаживать Chrome на iOS?)

Большое спасибо за вашу помощь!

Обновить

Я использовал следующий код, чтобы определить, является ли это Chrome на iOS 7, если это так, я скрываю ящик, когда виртуальная клавиатура встает, и повторно отображает ящик, когда виртуальная клавиатура выключена.

 function iOSversion() { if (/iP(hone|od|ad)/.test(navigator.platform)) { // supports iOS 2.0 and later: <http://bit.ly/TJjs1V> var v = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/); return [parseInt(v[1], 10), parseInt(v[2], 10), parseInt(v[3] || 0, 10)]; } } var iosVersion = iOSversion(); if (navigator.userAgent.match('CriOS') && iosVersion[0] == '7') { $(document).hammer().on('tap', 'input, textarea', function(e) { $('body').addClass('chromefixfixed'); }) .on('blur', 'input, textarea', function(){ body.removeClass('chromefixfixed'); }) } 

Код CSS:

 .chromefixfixed #drawer { display: none; } 

Тем не менее остается вопрос: как я могу заставить Chrome на iOS 7 работать как Chrome на Android (не скрывая ящик при закрытии клавиатуры)?

Спасибо за помощь!

One Solution collect form web for “iOS 7 Chrome – фиксированный позиционный ящик не остается внизу, когда всплывает виртуальная клавиатура”

Положение фиксированного дна и абсолютного нижнего положения – абсолютный кошмар на устройствах iOS и Android. По моему опыту, это просто невозможно заставить его последовательно воспроизводить даже самые современные устройства, не говоря уже о более старых, которые доминируют на рынке в настоящее время. Настолько, что в качестве разработчика я бы попросил дизайнера переосмыслить макет из-за этого. Я верю, что это называется «обойдя сундук».

  • ios-webkit-debug-proxy blank devtools
  • chrome - iOS 7 - iPhone: выбрать фон Spinner элемента формы - черный
  • ASP.NET Webforms не отображает функцию обратной передачи JavaScript для Chrome / iOS
  • Перегрузка: Chrome iOS Behavior
  • Как сделать фиксированный контент выше iOS-клавиатуры?
  • Почему простой сайт разбивается на мобильные устройства (как минимум, на iOS Safari и Chrome)?
  • blob не принимает Uint8Array на ios
  • Как правильно позиционировать курсор на IOS11 Safari во всплывающих формах?
  • Разрешение на геолокацию Chrome IOS HTML5 запрещено
  • Поведение браузеров мобильных приложений с сеансами Google и выбор учетной записи
  • Видео не воспроизводится на iOS10 Chrome
  • Interesting Posts

    Статический класс против Singleton

    Как установить темный фон для iOS10 сегодня виджет

    iPhone занимает увеличенный снимок экрана с AVCaptureVideoPreviewLayer

    Сортировка NSArray из NSString

    Есть ли способ связать цвет с переменной?

    iphone – сертификат распространения не отображается в доступе к цепочке ключей

    Предпочтение NSBundleLocalizations не возвращает доступную наиболее определенную локализацию

    Добавление отдельных элементов UIImageView для каждого элемента массива

    open viewcontroller из вкладки, как на странице камеры instagram на IOS

    Можно ли сделать приложение для iPhone, используя только c ++?

    Отображение NSArray файлов в UITableView – iOS 5

    Является ли API истории нарушенным на iOS? (Строка местоположения не обновляется на pushState)

    iOS: жестов прокрутки не распознается, когда салфетки начинаются снаружи экрана iPad

    SKPaymentTransaction: что такое транзакция?

    Кордова fileTransfer отлично работает на iOS, выдает код ошибки = 1 на Android

    PhoneC: Разработка iOS проста с помощью XCode, Swift3, UITableView, cocatouch, давайте создадим приложения для iPhone, iPad и Macbook.