Я создал страницу, на которой я использую 4 складных. проблема в том, что когда я запускаю приложение в эмуляторе или на мобильном телефоне и ввожу что-то в текстовое поле после закрытия клавиатуры, некоторое время верхний и нижний колонтитулы скрываются, а некоторое время оно скользит вместе со страницей, а после нажатия на страницу снова появляется. Я использую файлы jQM1.3.1.js. может кто подскажет в чем проблема и как ее решить.
Любое предложение приветствуется.
Кроме того, вы можете избежать переключения верхнего и нижнего колонтитула при касании, используя следующее в теге заголовка.
data-tap-toggle="false"
<div data-role="header" data-position="fixed" data-tap-toggle="false" data-theme="o">
Также на случай, если ваш верхний или нижний колонтитул перескакивает где-то не вверху страницы. Попробуй это:
Об этом сообщается как об ошибке jQM, но до сих пор не исправлено. Я использую jQM 1.3.2, и он все еще там, когда вы прокручиваете нижнюю часть страницы и нажимаете на текстовое поле или вводите, появляется клавиатура, и все в порядке, и как только элемент теряет фокус, заголовок прыгает и фиксируется себя не вверху страницы.
Попробуйте это решение, которое работает для меня, взятое из темы, указанной ниже.
// Workaround for buggy header/footer fixed position when virtual keyboard is on/off
$('input, textarea')
.on('focus', function (e) {
$('header, footer').css('position', 'absolute');
})
.on('blur', function (e) {
$('header, footer').css('position', 'fixed');
//force page redraw to fix incorrectly positioned fixed elements
setTimeout( function() {
window.scrollTo( $.mobile.window.scrollLeft(), $.mobile.window.scrollTop() );
}, 20 );
});
Другие решения размещены здесь. Стоит посмотреть ветку: https://github.com/jquery/jquery-mobile/issues/5532
Самый простой способ решить эту проблему с андроидом — использовать события фокуса ввода и размытия.
В jQuery: если вы используете тег нижнего колонтитула html5 или при необходимости измените имя класса.
$("input").focus(function(){
$('footer').hide();
});
$("input").blur(function(){
$('footer').show();
});
