Cordova / Phonegap 3.1键盘(仍然)覆盖重点forms领域 – iOS 7
嗨,大家好,我刚刚从cordova3.0升级到3.1,我仍然遇到一个非常令人不安的问题(在使用KeyboardShrinksView首选项时仍然存在)。
每当我聚焦触发键盘打开的元素(input / textarea)时,元素就会隐藏在键盘后面,我需要向下滚动(使用webkit-overflow-scrolling进行滚动),以便查看元素及其内容。
当KeyboardShrinksView设置为true时,页面将不会滚动,甚至更糟糕。
任何解决scheme,以解决这个问题? 我已经看到了一些问题和错误报告,但没有工作的解决scheme(或解决scheme)。
玩“全屏”的偏好不会解决问题。
谢谢你的帮助
刚刚有一个非常类似的问题。 一些在这个网站上发现的黑客确实工作,但有令人讨厌的副作用(如使滚动或CSS布局混乱)。 最后想出了一个全新的愚蠢的黑客。
视口元标记:
<meta name="viewport" content="initial-scale=1, maximum-scale=1, width=device-width" />
加载后运行JavaScript:
document.body.style.height = screen.availHeight + 'px';
就是这样。 适用于iOS 7,我不知道为什么 。
最后用下面的插件修复了这个问题: jQuery scrollTo plugin
每当我专注于一个元素,我正在触发一个焦点事件,进行以下计算并更新滚动位置:
updateScroll: function(e){ var el = $(e.currentTarget); var offset = -$(".scrollerWrap").height() + $(el).height(); $(".scrollerWrap").scrollTo(el,{offset: offset}); }
将input/文本区的底部粘到键盘的顶部。 就像一个魅力,即使解决scheme需要通过这一点的JavaScript。
那么,逻辑上,键盘打开时视图应该向上移动。 我遇到了与iOS7类似的问题,并修复它,我已经应用了几个CSS的调整。
调整应用于包含应用程序内容的包装类/ id。
position: relative; overflow: hidden; height: 460px; width: 320px;
注 – 高度和宽度根据设备的高度和宽度dynamic判断
height = window.innerHeight width = window.innerWidth
通过使用jQueryselect器,将高度和宽度附加到包装类/ id。
为我工作。
document.body.style.height = (screen.availHeight - 100) + 'px';
我认为这里的问题来自于Framework7。
document.body.style.height = window.outerHeight + 'px';
上面的代码放在我的index.js文件中,就像魅力一样。