内容简介:翻译自:https://stackoverflow.com/questions/13097663/jquery-mobile-fixed-footer-is-moving-when-the-keyboard-appears
我使用Phonegap和jQuery Mobile设计了一个应用程序.固定页脚正常工作,直到我点击下拉列表或文本字段,这会导致页脚从视图中消失( Android
4.0)或移动到视图的中间(Android 2.2 Galaxy Tab).有什么建议?
Phonegap版本:Cordova 2.1.0
jQuery Mobile版本: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
}
});
公差考虑了纵向高度与纵向宽度的不精确计算,反之亦然.
翻译自:https://stackoverflow.com/questions/13097663/jquery-mobile-fixed-footer-is-moving-when-the-keyboard-appears
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- Android获取软键盘的高度、键盘的打开与关闭、监听键盘处于打开还是关闭状态
- ios 最新系统bug与解决——微信公众号中弹出键盘再收起时,原虚拟键盘位点击
- iOS键盘动画细节
- Swift关闭UITextView键盘
- ios 最新系统bug与解决——微信公众号中弹出键盘再收起时,原虚拟键盘位点击事件无效
- Swift自定义表情键盘+录音
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Web渗透技术及实战案例解析
陈小兵 / 范渊、孙立伟 / 电子工业出版社 / 2012-4 / 89.00元
《Web渗透技术及实战案例解析》从Web渗透的专业角度,结合网络安全中的实际案例,图文并茂地再现Web渗透的精彩过程。《Web渗透技术及实战案例解析》共分7章,由浅入深地介绍和分析了目前网络流行的Web渗透攻击方法和手段,并结合作者多年的网络安全实践经验给出了相对应的安全防范措施,对一些经典案例还给出了经验总结和技巧,通过阅读《Web渗透技术及实战案例解析》可以快速掌握目前Web渗透的主流技术。《......一起来看看 《Web渗透技术及实战案例解析》 这本书的介绍吧!