Question

如果您使用<body>的百分比（或视口单位）宽度和高度，则一个已知问题是，当移动键盘因输入而调用时，任何百分比/视口元素的大小都会发生变化。

我对这个问题进行了很多搜索，没有什么能真正起到帮助。

我发现其中一个答案是根据新视口调整布局： mobile viewport resize due to keyboard

但这不太实际。

有人知道如何操作网络上的移动键盘吗？

经过一些测试后我发现了一个黑客，我会在答案中加入，如果有更好的方法，请告诉：）

Answer 1

使用javascript / jquery在px中设置<body>的高度和宽度。

使用此代码：

$(function() {
    var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
    var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
    $("html").css({"width":w,"height":h});
    $("body").css({"width":w,"height":h});
});

在这种情况下，<body>将根据视口设置为px，并且仍会修复viewborad的任何更改。

如果键盘覆盖输入，您可以轻松地将输入的位置更改为fixed，将top更改为0.

移动键盘更改html视口大小

1 个答案: