Intereting Posts
Как использовать виджет NumPicker для Android 4.0 Как реализовать салфетку между Фрагментами? Перенаправить событие касания на TextView с помощью ClickableSpan в родительский вид Android LayoutAnimationController: как заставить первого ребенка ждать завершения анимации последнего ребенка до повторения? Как создать прозрачный демонстрационный экран для Android-приложения? Android Packager: java.util.zip.ZipException: двойная запись: classes.dex Не удается завершить установку из-за противоречивой зависимости. Ошибка Eclipse для ADT Добавление изображений в галерею эмулятора Использование onSaveInstanceState с фрагментами в backstack? Воспроизведение или передача контента из стандартного проигрывателя в VrVideoView Android – android.widget.TabHost не может быть добавлен в android.support.v4.app.FragmentTabHost Загружать контент, когда приложение обновляется через Google Play? Расширение фрагментов с использованием списка Что такое размер шрифта элемента ActionBar по умолчанию? Как я могу включить USB Tethering программным способом на устройстве Android 4.0?

JQuery Мобильный фиксированный footer перемещается, когда появляется клавиатура

Я разработал приложение, используя Phonegap и jQuery Mobile. Фиксированный нижний колонтитул работает правильно, пока я не нажму на раскрывающееся меню или текстовое поле, из-за чего нижний колонтитул либо исчезнет из вида (Android 4.0), либо переместится в середину экрана (Android 2.2 Galaxy Tab). Какие-либо предложения?

Phonegap Версия: Cordova 2.1.0
JQuery Мобильная версия: 1.2.0

Вот мой код:

<div data-role="footer" class="nav-mobilyzer" data-tap-toggle="false" data-position="fixed"> <div data-role="navbar" class="nav-mobilyzer" data-grid="d"> <h1>footer</h1> </div> </div> 

У меня была проблема в некоторых устройствах, нижний колонтитул отображался, а в других – нет. Я нашел, что это сработало для меня:

 var initialScreenSize = window.innerHeight; window.addEventListener("resize", function() { if(window.innerHeight < initialScreenSize){ $("[data-role=footer]").hide(); } else{ $("[data-role=footer]").show(); } }); 

РЕДАКТИРОВАТЬ:

Но как насчет изменений ориентации?

 var portraitScreenHeight; var landscapeScreenHeight; if(window.orientation === 0 || window.orientation === 180){ portraitScreenHeight = $(window).height(); landscapeScreenHeight = $(window).width(); } else{ portraitScreenHeight = $(window).width(); landscapeScreenHeight = $(window).height(); } var tolerance = 25; $(window).bind('resize', function(){ if((window.orientation === 0 || window.orientation === 180) && ((window.innerHeight + tolerance) < portraitScreenHeight)){ // keyboard visible in portrait } else if((window.innerHeight + tolerance) < landscapeScreenHeight){ // keyboard visible in landscape } else{ // keyboard NOT visible } }); 

Допуск учитывает неточный расчет высоты ландшафта с шириной портрета и наоборот.

Хорошо, эта ветка так же стара, как и Интернет в данный момент, но ответ выше не помог мне.

Лучший способ, которым я нашел, – связать метод с событием jquery .blur (), а затем вызвать методы fixedtoolbar () в очень определенном порядке, т. Е.

  var that = this; $(':input').blur(function(){ that.onFocusLoss(); }); 

……

 onFocusLoss : function() { try { $("[data-position='fixed']").fixedtoolbar(); $("[data-position='fixed']").fixedtoolbar('destroy'); $("[data-position='fixed']").fixedtoolbar(); console.log('bam'); } catch(e) { console.log(e); } }, 

Клавиатура открывается, когда мы фокусируемся на входе, поэтому:

 // hide the footer when input is active $("input").blur(function() { $("[data-role=footer]").show(); }); $("input").focus(function() { $("[data-role=footer]").hide(); }); 

Вы также можете обнаружить, когда клавиатура показывает и когда она скрывается, и показывать или скрывать нижний колонтитул соответственно:

 document.addEventListener("showkeyboard", function(){ $("[data-role=footer]").hide();}, false); document.addEventListener("hidekeyboard", function(){ $("[data-role=footer]").show();}, false); 

Попробуйте data-hide-while-focus = "" и установите его в пустую строку.

Мое решение использует другой атрибут JQUERY для нижнего колонтитула div. Добавление данных – fullscreen = "true" к этому div – все, что мне нужно. Я знаю, что это исправление может быть недоступно до недавнего времени, но я использую jqm 1.3.2 и jq 1.9. Я думал, что отправлю это решение на всякий случай, если это поможет кому-то. Удачи. 🙂