Android - Webview, поля ввода удвоились?

Question

Я пытаюсь создать приложение для Android, которое использует веб-просмотр, чтобы позволить пользователям вводить свое имя пользователя / пароль, но при нажатии на поля ввода они удваиваются (см. Рисунок ниже).Я использую плагин iScroll jQuery, чтобы позволить пользователям прокручивать страницу вверх, когда клавиатура поднимается, и блокирует область ввода.Вот макет / css:

CSS:

#scroller{
    position:absolute;
    overflow:hidden;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index:0;

}
#scroll_content {
    margin-top: 70px;/*must match the topbar height*/
    padding-bottom:70px;
}

html:

...
<div id="scroller">
  <div id="scroll_content">
    <!-- page content here -->
  </div>
</div>
...

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

Спасибо

Answer 1

Вероятно, это связано с переходами CSS.Телефон, похоже, потерял представление о реальной позиции текстового поля.По сути, это похоже на путаницу между абсолютным позиционированием и translate3d (), которую выполняет iscroll.Самый простой способ исправить это - установить translate3d (0,0,0) при запуске вашего div, чтобы убедиться, что он знает, где он находится.Посмотрите мою статью для получения более подробной информации: http://java -cerise.blogspot.com / 2011/10 / dodgy-double-input-fields-on-android.html надеюсь, что это поможет.

Answer 2

добавить следующее к вам css:

#your-container-div-id{
    -webkit-transform: translate3d(0,0,0);
}