我一直试图让这项工作好几天,没有运气,所以我想我会分享信息,也许有人想出一个解决方案.
我想在软键盘启动时获得确切的视口大小.我目前在标题上使用以下代码,以便网站响应:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
Run Code Online (Sandbox Code Playgroud)
我意识到当软键盘出现时,它使用设备高度作为视口高度并向上推动站点的其余部分 - 这使我认为它从width = device-width选项获得它的高度.
启动软键盘后使用以下代码:
setTimeout(function() {
viewport = document.querySelector("meta[name=viewport]");
viewport.setAttribute('content', 'height=auto');
}, 300)
Run Code Online (Sandbox Code Playgroud)
然后使用jquery获取高度在Android上显示CORRECT结果 - 也就是可见的视口大小,没有虚拟键盘,但在iOS上没有.我得到一个随机数,我假设源于其余的元标记不存在,所以我得到了网站的放大版本以及75或100之类的数字(在iphone 4s上)
我也尝试在键盘上升后创建一个固定元素,使其使用top:0的视口高度; 和底部:0; 属性,但我仍然得到原始的高度.
更接近这一点的是将视口元标记高度设置为固定值,可以通过jquery获取$(window).height(),这意味着元标记在启动键盘后实际上有所不同,但是对于固定的没有真正的价值高度.
我已经看到很多关于此的主题,但没有一个解决方案.有解决方案吗?