javascript - 防止虚拟键盘向上推内容

Question

我有网站；带有输入的背景图像。当我按下手机上的输入时，键盘打开，所有内容都被推上去。相反，我希望内容留在原地，键盘只是在不影响(移动)内容的情况下浏览内容。我看到了这个解决方案:

input.onfocus = function () {
    window.scrollTo(0, 0);
    document.body.scrollTop = 0;
}

但是好像不行。我期待着您的回答!

Answer 1

你可以看看这个StackOverflow发布，但我将为您总结最有用的部分:

从输入的 CSS 作为 position: fixed; 开始。聚焦时，将其更改为 absolute。这是一个 JS 示例:

if (document.getElementById("fixed") == document.activeElement) {
    document.getElementById("fixed").class += "absolute"
}

当然，这依赖于 CSS:

#fixed {
    ...
    position: fixed;
}
#fixed.absolute {
    position: absolute;
}

希望对您有所帮助!