PhoneGap / JQuery Mobile - нарушение стиля страницы, когда клавиатура видна - PullRequest
4 голосов
/ 18 июля 2011

У меня есть приложение, созданное с помощью Phonegap и JQuery Mobile.Всякий раз, когда отображается программная клавиатура - при вводе формы и т. Д. - вся страница изменяется.Изображения, кнопки и текст.Что я предполагаю, что что-то нарушает CSS?

Кто-нибудь еще имел эту проблему, или знаете, почему это может происходить?Мне нужно перезапустить приложение, чтобы сбросить макет.

Любые идеи приветствуются!

Спасибо!

Ответы [ 3 ]

14 голосов
/ 29 июля 2011

Я нашел ответы здесь:

http://solutions.michaelbrooks.ca/2011/07/05/android-soft-keyboard-resizes-web-view/

http://comments.gmane.org/gmane.comp.handhelds.phonegap/10207

Комбинация добавления:

android:windowSoftInputMode="adjustPan"

в AndroidManifest.xml

и <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, target-densityDpi=device-dpi" />

to index.html, сделали работу за меня.

Надеюсь, это кому-нибудь поможет.

2 голосов
/ 05 июля 2014

Для пользователей Phonegap Build в файле config.xml есть предпочтение обёртывания,

<preference name="android-windowSoftInputMode" value="stateHidden|adjustPan" />

Значения, которые он может принимать, совпадают с собственными свойствами Android, если вам нужна дополнительная информация о параметрах и поведении, обратитесь к руководству разработчика Android здесь: http://developer.android.com/guide/topics/manifest/activity-element.html#wsoft

Я проверил это с помощью Phonegap Build 3.3.0 и jQuery Mobile и работал нормально, надеюсь, это поможет.

0 голосов
/ 21 сентября 2013

У меня есть проверенное решение этой проблемы, я тоже столкнулся с той же проблемой, но решил ее сам. Сначала создайте поле внутри тела и сделайте его скрытым, или вы можете скрыть его за элементом div, используя z-index, чтобы оно не было видно.

<code><script>
$(document).ready(function() {
document.getElementById('example').value='';
});
 </script>
   <body>
   <div style='z-index:50;position:absolute;height:100%;width:100%;'>
   Your page matter here</div>
    <select id='example' style='z-index:10'>
    <option value=''>a</option>
    </select>

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

...